main-mega li ul，＃nav-main-mega .sub {display：none;}

Question

我想知道是否有人能够对我遇到的问题有所了解......

我在以下网站上使用了jQuery Mega Menu脚本：

我从以下网站找到了脚本：

问题是在加载时，我可以看到文本以无格式的方式快速闪烁，如下图所示：

我正在寻找解决这个问题的方法，但我不确定从哪里开始。我查看了开发者网站，评论和Google，但无法找到解决方案。我想也许有一个将它放在暂时隐藏的Div中，直到脚本加载。

非常感谢帮助！

Answer 1

我认为这个问题是由于html加载然后jquery插件运行而引起的。我在u.i选项卡和jquery表单向导上看到了这种情况（例如：http://thecodemine.org/）。

我认为你不能让jquery以比文档准备好更快的速度绑定。我建议的一件事是使用css（display：none;）隐藏那些子菜单，这样它们将被隐藏，你不会看到它们闪烁。

Answer 2

chobo2是正确的。

您可以使用初始化菜单时添加的mega菜单类，然后在菜单形成后取消隐藏它们：

main-mega .sub ul {display：block;}

Answer 3

您可以在加载前使用CSS隐藏子菜单：

#menu li ul {display: none;}
#menu .sub ul {display: block;}

Answer 4

我遇到了同样的问题。通过添加这个作为关于大型菜单的任何CSS的第一行，我得到了停止闪烁的菜单：

.megamenu li > div {display: none}

Answer 5

将此作为第一行添加到用于大型菜单的CSS文件中：

.mega-menu li > div {display: none}

然后添加一些jQuery以在doc ready上再次显示该项：

$(document).ready(function () {
    $('.mega-menu li > div').css('display', 'block');
});

这将消除闪烁。我试过这里的每一个解决方案都没有100％为我工作。这在IE11中有效。

Answer 6

在菜单CSS的第一行，您必须使用以下行： -

#menu li ul {display: none;}
#menu .sub ul {display: block;}