i am trying to develop my own accordion/sliding menu. (as a side qn, any good ones that can be easily customized/skinned?)
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 $("#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>