Tagged: , , ,

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • February 15, 2021 at 12:46 pm #1280504
    mc_wa

    Hey folks,
    I checked several toggle solutions (also the one under your docs https://kriesi.at/documentation/enfold/button/#toggle-id-7), but got none of them to work out of the box.I think it has something to do with jQuery or the color section, because I get an easier toggle option (Div toggle – https://jsfiddle.net/p5wkvrj9/) to work when using code block + jQuery directly from Google, even though the same jQuery 3.5.1 was already loaded with Enfold.

    Still, with the jQuery on board I can’t get it to work, nothing happens when I click the button.

    – newest Enfold
    – same result with deactivated cache plugin
    – jQuery migrated deactivated

    Any hints?

    • This topic was modified 3 years, 9 months ago by Ismael.
    February 16, 2021 at 11:00 am #1281291
    Rikard

    Hey mc_wa,

    Could you post a link to where we can see the problem you are having?

    Best regards,
    Rikard

    February 16, 2021 at 3:20 pm #1281361
    mc_wa

    Thanks for your reply, posted the link in privat area.

    February 18, 2021 at 4:30 am #1281928
    Rikard

    Hi,

    Thanks for that. I’m seeing jQuery error messages coming from the file in private, what happens if you disable that plugin?

    Best regards,
    Rikard

    February 22, 2021 at 3:57 pm #1282839
    mc_wa

    Hi Rikard,

    thanks for your reply. Disabling the plugin didn’t yield other results. Still no luck with toggling.

    February 25, 2021 at 2:30 pm #1283671
    Ismael

    Hi,

    Thank you for the update.

    Instead of using the window.load function, try to use the following instead.

    $(document).ready(function(){
   // code here
}):

    It might not be working because window.load is already deprecated or invalid.

    Best regards,
    Ismael

    February 26, 2021 at 12:19 pm #1283826
    mc_wa

    Thanks Ismael, this helped, but with the “easy code”, not the one from Enfold docs.

    Solution
    » Add this to functions.php ofr your child theme:

    <script>
(function($){
 $(document).ready(function(){
    $('#toggle-color-section').addClass('notseen');
    $('.avia-button-wrap.color-section-toggler a').click(function () {
     $('#toggle-color-section').toggleClass('notseen');
   
    });
  });
})(jQuery);
</script>

    Ad this to custom CSS:

    .notseen {
	display: none;
}

    Give the color section the ID: “#toggle-color-section”
    Give the button the class: “color-section-toggler”
    Gibe the button the link target: “javascript:void(0)” (so the page doesn’t reload)

    There was a code for changing button text as well out there on the forums, in case someone is interested.

    • This reply was modified 3 years, 10 months ago by mc_wa.
    March 1, 2021 at 12:54 pm #1284398
    Ismael

    Hi,

    Glad to know that it is working. And thank you for sharing the code.

    Best regards,
    Ismael

  • Author
    Posts
Viewing 8 posts - 1 through 8 (of 8 total)
  • The topic ‘Color Section Toggle not working’ is closed to new replies.