jQuery下拉菜单闪烁

标签 jquery drop-down-menu

我的下拉菜单遇到问题,该菜单使用 jquery SlideDown 和 SlideUp 函数。

如果您将鼠标放在下拉菜单 UL 上,如果您将其移出并移回内部,同时它仍在向上滑动,它就会开始闪烁/闪烁,就好像它正在快速快速触发 mouseenter 和 mouseleave 事件一样。

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

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

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

我确实尝试用一个简单的悬停函数替换整个 .each 循环,但这样做后我的上滑和下滑动画不起作用。

最佳答案

试试这个:

(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);

关于jQuery下拉菜单闪烁,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12749010/

相关文章:

javascript - Bootstrap 模式不会在页面加载时打开

javascript - 将模块与 browserify 捆绑后在控制台中显示未定义

javascript - 从下拉列表中选择多个值并调用 javaScript 函数

Android ActionBar 菜单点(带 3 个点)

javascript - JQuery 什么是 core.js(在 jQuery 3.3.1 中)

jquery - 带有自己的导航的多个 Jquery 循环幻灯片

jquery - 菜单中的内容在重新加载/刷新页面时闪烁

css - 浏览器中的 RTL 下拉问题(Windows7 或 Vista)

jquery - 需要在 jQuery 中将所有 JSON 从 AJAX 推送到数组中

HTML/CSS 下拉菜单宽度。请帮助