Dropdown navigation in firefox
I'm developing a drown down navigation with a pretty standard ul/li structure:
markup structure for the navigation...
-
<ul>
<li>home</li>
<li class="subMenu">some stuff
<ul>
<li>a bunch more stuff</li>
<li>a bunch more stuff</li>
<li>a bunch more stuff</li>
<ul>
</li>
<li class="subMenu">some more stuff
<ul>
<li>more stuff</li>
<li>more stuff</li>
<li>more stuff</li>
<ul>
</li>
</ul>
So, my issue is this:
when running through the options in the nav menu, if there is a form element (select, input, etc...) the mouseout event is not firing and the menu stays open.. Here's my code for the menu, which works, except or this one issue which i'd like to resolve:
-
jQuery(document).ready(
function(){
jQuery(".subMenu").hover(
function(){
jQuery(this).find('ul').fadeIn("fast").css({ height: 130});
},
function(){
jQuery(this).find('ul').fadeOut("fast").css({ height: 0});
}
);
}
);
Does any one have any idea why the event does not fire and, beyond that - how I can fix this so that the menu closes...
I had a couple ideas... one was listening to document.body clicks, getting the element underneath and if the menu's are still open then close them... But i'm thinking there has to be a better solution...
Thanks!