IE 和 Firefox 中闪烁的下拉菜单答案

【问题标题】：Flickering Drop down Menu in IE and FirefoxIE 和 Firefox 中闪烁的下拉菜单
【发布时间】：2013-05-24 13:12:10
【问题描述】：

我创建了一个在许多网站上都使用过的下拉菜单。出于某种原因，在此应用程序 (http://quaker.wpengine.com/) 中，菜单会闪烁并且在 Firefox 和 IE8-10 中都出现错误定位。它在 Chrome 和 Safari 中运行良好。知道为什么会发生这种情况吗？我认为这是一个 CSS 问题，但我一生都无法解决。

感谢您的帮助！

这是我在菜单上使用的 JS：

//Add necessary classes to navigation
$('ul.level-1 > li > ul').addClass('level-2');
$('ul.level-1 ul > li ul').addClass('level-3');
$('li:has(> ul)').addClass('has-subnav');

// Mobile Navigation
$('body').addClass('js');
var $menu = $('#menu'),
$menulink = $('.menu-link'),
$menuTrigger = $('.has-subnav > a');

$menulink.click(function(e) {
    //e.preventDefault();
    $menulink.toggleClass('active');
    $menu.toggleClass('active');
});

$menuTrigger.click(function(e) {
    if ( $(window).width() < 768) {
       e.preventDefault();
    }       

    var $this = $(this);
    $this.toggleClass('active').next('ul').toggleClass('active');
}); 

//Remove active class on desktop version
$('ul.level-1 > li').hover(
    function () {
        $('ul.level-1 > li').removeClass('active');
        var $this = $(this);
        if( $this.children('ul.level-2').css('display') != 'none' )  { 
            $this.addClass('active');
        } else {
            $this.removeClass('active');
        }
    },
    function () {
        var $this = $(this);
        if( $this.children('ul.level-2').css('display') != 'none' )  { 
            $this.addClass('active');
        } else {
            $this.removeClass('active');
        }
    }
);

【问题讨论】：

比css我怀疑它的问题来自用于该菜单悬停的Js代码。那么你有没有为菜单功能使用过任何 js 代码？
我正在使用一些 JS。如果我把它粘贴在上面会有帮助吗？
你会更好:)
刚刚添加。谢谢！
我需要这个类的css active，你能提供这个

标签： jquery css drop-down-menu navigation

【解决方案1】：

我发现了问题所在。当您将鼠标悬停在导航中的 a 属性上时，我有一条杂散的 CSS 代码以某种方式被添加并说应用某些样式。这些带有li 悬停样式/JS 的样式发生冲突并导致一些问题。我删除了 CSS 行，我们都很好！

【讨论】：