jQuery下拉菜单闪烁

时间:2012-10-05 15:05:13

标签: jquery drop-down-menu

我的下拉菜单存在问题,该菜单使用了jquery slideDown和slideUp函数。

如果您的鼠标悬停在下拉列表UL上,如果您将鼠标移到内部并且仍在向上滑动时它会开始闪烁/闪烁,就好像它正在快速点火中触发mouseenter和mouseleave事件一样。

我设置了一个小提琴来说明问题:http://jsfiddle.net/LxL8Q/3/

在Chrome中,它只会闪烁一秒,然后在Firefox中自行解决,但它会无限期地继续闪烁。

我知道这里有很多与闪烁jQuery有关的问题,但我无法找到任何可以帮助我的答案。

我确实尝试使用简单的悬停功能替换整个.each循环,但在执行此操作后,我的幻灯片和滑动动画无法正常工作。

2 个答案:

答案 0 :(得分:2)

试试这个:

(function($){  

var nav = $("#topNav");  

nav.find("li").each(function() {  
if ($(this).find("ul").length > 0) {  

    //show subnav on hover  
    $(this).mouseover(function() {  
        $(this).find("ul").slideDown(300);  
    });  
    //hide submenus on exit  
    $(this).mouseleave(function() {  
        $(this).removeClass('active').find("ul").stop(true).slideUp(300);  
    });  
 }  
});

})(jQuery);

答案 1 :(得分:0)

我遇到了这个问题并找到了解决方案:在delay(50)之前添加slideUp(300)。在这里查看新的小提琴:http://jsfiddle.net/LxL8Q/42/