I wrote a custom dropdown menu, the issue is that if you hover over it to quick it starts going up and down frantically. Here is an example: http://www.norrispenrose.com/
Here is my jQuery Code:
jQuery(document).ready(function(){ // menu system
jQuery('#mainMenu li').hover(function() {
jQuery(this).corner('5px');
});
jQuery('#mainMenu li').h开发者_C百科over(function() {
if(jQuery(this).children().is('ul'))
{
jQuery(this).uncorner();
jQuery(this).corner('top 5px');
jQuery('ul', this).slideDown('fast');
jQuery('ul', this).uncorner();
jQuery('ul', this).corner('tr br bl 5px');
jQuery(this).addClass('dropHover');
}
else
{
//Do nothing
}
}, function() {
jQuery('ul', this).slideUp('fast');
jQuery(this).delay(200).queue(function () {
jQuery(this).removeClass('dropHover');
jQuery(this).dequeue();
});
jQuery(this).uncorner();
});
});
Any help would be appreciated!
Before your slideUp
and slideDown
use the jQuery stop()
method (docs) to clear the animation queue. For example from your code:
jQuery('ul', this).stop(true, true).slideDown('fast');
Have a look at the HoverIntent plug-in. That should solve your problem.
精彩评论