WordPress jQuery menu development

I’m pretty new to jquery in wordpress. I have managed to blend in the submenu when my mouse is over a first-level element of the menu.

$('li.menu-item').mouseenter(function() {
    $(this).children().fadeIn();
});

When the user leaves the 2nd level elements of the menu it disappears like it should.

Read More
$('li.menu-item > ul').mouseleave(function() {
    $(this).fadeOut('fast');
});

My problem is now, that when I move the mouse from one first-level element to the next both 2nd-level menus are shown.
I tried

$('li.menu-item').mouseleave(function() {
    // $(this).children().fadeOut();
});

But with that the 1st-level element disappears as well.

Related posts

Leave a Reply