• I’m working on this website. The problem i’ve run into is the menu doesn’t collapse. What i’m shooting for is that a user clicks on “winkel” and the menu opens. After that if a user clicks a menu items that isn’t on the sublevel it has to collapse.

Viewing 15 replies - 1 through 15 (of 16 total)
  • This should do what you want:

    jQuery('.sub-menu').hide();
    jQuery('.sub-menu').closest('.menu-item').click(function(e){
    	jQuery(this).find('.sub-menu').slideToggle();
    	e.preventDefault();
    });

    `

    Thread Starter Sjaakbonestaak

    (@sjaakbonestaak)

    Thanks for your reply, but where do i put the code?

    Copy this:

    <script type="text/javascript">
    jQuery('.sub-menu').hide();
    jQuery('.sub-menu').closest('.menu-item').click(function(e){
    	jQuery(this).find('.sub-menu').slideToggle();
    	e.preventDefault();
    });
    </script>

    and paste right before the closing
    </body>
    tag, which is usually located in the file footer.php.

    Thread Starter Sjaakbonestaak

    (@sjaakbonestaak)

    Works like a charm. Thank you very much

    Thread Starter Sjaakbonestaak

    (@sjaakbonestaak)

    Oh wait it seems i put on my partyhat too soon. I can’t click the subitems anymore. However the menu does open and collapse like i wanted.

    My bad! Try this one:

    <script type="text/javascript">
    jQuery('.sub-menu').hide();
    jQuery('.sub-menu').closest('.menu-item > a').click(function(e){
    	jQuery(this).parent().find('.sub-menu').slideToggle();
    	e.preventDefault();
    });
    </script>

    Thread Starter Sjaakbonestaak

    (@sjaakbonestaak)

    Thanks for the quick reply, however this doesn’t work either. When i click the “winkel” menuitem it doesn’t open and when i click a different menuitem it briefly shows an open menu but after that it closes again.

    Then please remove this code from your site, after that I will open your site and will try writing the code again.

    Thread Starter Sjaakbonestaak

    (@sjaakbonestaak)

    i removed the code

    <script type="text/javascript">
    jQuery('.sub-menu').hide();
    jQuery('.sub-menu').closest('.menu-item').children('a').click(function(e){
    	jQuery(this).parent().find('.sub-menu').slideToggle();
    	e.preventDefault();
    	});
    </script>
    Thread Starter Sjaakbonestaak

    (@sjaakbonestaak)

    Thanks alot for this, but is there a way for the menu to stay open after i click a subitem?

    Please remove the code once again, I’m going to test the new version.

    Thread Starter Sjaakbonestaak

    (@sjaakbonestaak)

    I removed it

    Now try this one

    if(jQuery('.current-menu-ancestor').length == 0) {
    	jQuery('.sub-menu').hide();
    }
    jQuery('.sub-menu').closest('.menu-item').children('a').click(function(e){
    	jQuery(this).parent('.menu-item').children('.sub-menu').slideToggle();
    	e.preventDefault();
    })

    Thread Starter Sjaakbonestaak

    (@sjaakbonestaak)

    Thats it! Thank you for all your help

Viewing 15 replies - 1 through 15 (of 16 total)
  • The topic ‘Menu won't collapse’ is closed to new replies.