Search code examples
jquerycssmenusubmenu

Submenu links doesnt work on multilevel jQuery menu

im working on a very simple "Multilevel menu" with jQuery.

Here is the code

The links inside the .sub-nav can't be clicked because the parent li is above them. ¿Any help?

Thanks!!

Solution

  • Bind click event to link inside <li> element, when clicked get parent of this link element and then slide toggle sub-nav.

    Give it a try. ;)

    EDIT:

    I made it with a next() jQuery selector: here's js code:

    $(document).ready(function(){
    $('.nav > li > a').click(function(e) {
    e.preventDefault();
    $(this).next().slideToggle();
});
});

    Notice that > prevents the clicked <li> element itself from sliding. It basically says that I want to bind event of clicking link which is direct child of <li> element which is direct child of an element with .nav class.