While there are a few problems with your code, I think you could
achieve your desired effect if you threw the ul#slidemenu and
#dropmenu into a containing div and then apply the hover function to
the container.
Something like this:
-- HTML --
<div id"nav-container">
<div class="grid_16 alpha" id="navigatie">
<div class="grid_16 alpha" id="mainmenu">
<ul id="slidemenu">
<li class="menu_a"><a href="#">MENU A</a></li>
<li class="menu_b"><a href="#">MENU B</a> </li>
<li class="menu_c"><a href="#">MENU C</a> </li>
<li class="menu_d omega"><a href="#">MENU D</a> </li>
</ul>
</div>
</div><!-- .end navigatie-->
<div style="display: none;" class="grid_16 alpha omega" id="dropmenu">
<div id="dropcontent">
<ul class="drop_1">
<li><a href="#">A</a></li>
<li><a href="#">AA</a></li>
</ul>
<ul class="drop_2">
<li><a href="#">B</a></li>
<li><a href="#">BB</a></li>
<li><a href="#">BBB</a></li>
<li><a href="#">BBBB</a></li>
<li><a href="#">BBBBB</a></li>
</ul>
<ul class="drop_3">
<li><a href="#">C</a></li>
<li><a href="#">CC</a></li>
<li><a href="#">CCC</a></li>
<li><a href="#">CCCC</a></li>
<li><a href="#">CCC</a></li>
</ul>
<ul class="drop_4">
<li><a href="#">C</a></li>
<li><a href="#">CC</a></li>
<li><a href="#">CCC</a></li>
<li><a href="#">CCCC</a></li>
<li><a href="#">CCC</a></li>
</ul>
</div>
</div>
</div><!-- End Nav Container -->
-- jQuery --
<script type="text/javascript">
$(document).ready(function() {
$("#nav-container").hover(function() {
$("#dropmenu").slideToggle("fast");
}, function() {
$("#dropmenu").slideToggle("fast");
});
});
</script>
Sorry for the poor formatting, but that was copied and pasted from
your HTML.
You might need to add .stop() in there to prevent any unwanted
animation queue as well.
Hope that helps.
Chris
On Feb 7, 8:15 am, 123gotoandplay <wesweatyous...@gmail.com> wrote:
> Hi,
>
> I am having a problem withwww.bldd.nl/prototypes/megamenu/test11.html
>
> When you quickly rollover the menu it keeps in "rollover" state, how
> can i fix this???
>
> regards,
