i am trying to develop my own accordion/sliding menu. i found that seem to trigger when i am sliding down an "inner" menu. since its "inner", my mouse definately has not left #mainnav
my test page http://iceangel89.5gigs.net/test.html without that annoying test alert http://iceangel89.5gigs.net/test_1.html i also noticed that it triggers when i enter the 4th "Link" which triggers the slidedown of an inner ul. when i disable the sliding effects, and make inner uls display notmally, when i move in and out of child elem's no such problem $("#mainnav").mouseleave(function() { alert("mouseleave #mainnav"); }); more complete source: $(function() { $("#mainnav > li > a").hover(mouseOver); $("#mainnav").mouseleave(function() { alert("mouseleave #mainnav"); }); }); function mouseOver() { $(this).next("ul").slideDown("fast", function() { $("li:has(ul) > a", this).hover(mouseOver); }); } #mainnav, #mainnav ul { list-style: none; padding: 0; margin: 0; background: #bbb; } #mainnav ul { display: none; margin: 5px 10px; } #mainnav a { display: block; padding: 5px 10px; margin: 2px 0; background: yellow; } <ul id="mainnav"> <li><a href="#">Test</a></li> <li><a href="#">Test</a></li> <li><a href="#">Test</a></li> <li> <a href="#">Test</a> <ul> <li><a href="#">Test</a></li> <li> <a href="#">Test 1</a> <ul> <li><a href="#">Test</a></li> <li><a href="#">Test</a></li> <li><a href="#">Test</a></li> </ul> </li> <li><a href="#">Test</a></li> </ul> </li> <li><a href="#">Test</a></li> <li><a href="#">Test</a></li> </ul>