1

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

我为以下网站使用了 jQuery Mega Menu 脚本:

http://www.furnituremind.co.uk/

我从以下站点找到了脚本:

http://designchemical.com/lab/jquery-mega-drop-down-menu-plugin/examples/

问题是在加载时,我可以看到文本以未格式化的方式快速闪烁,如下图所示:

http://img838.imageshack.us/img838/4421/screenshot20111221at193.png

我正在寻找解决此问题的方法,但不确定从哪里开始。我检查了开发者网站、评论和谷歌,但找不到解决方案。我想也许有一个将它放在一个临时隐藏的 Div 中,直到脚本被加载。

非常感谢您的帮助!

4

6 回答 6

2

我认为这个问题是因为 html 加载然后 jquery 插件运行。我在 ui 选项卡和 jquery 表单向导上看到了这种情况(例如:http ://thecodemine.org/ )。

我不认为你可以让 jquery 比准备好文档更快地绑定。我建议的一件事是使用 css (display: none;) 隐藏这些子菜单,这样它们就会被隐藏并且你不会看到它们闪烁。

于 2011-12-21T23:00:49.313 回答
1

chobo2 是正确的。

您可以使用初始化菜单时添加的巨型菜单类,然后在菜单形成后取消隐藏它们:

main-mega li ul,#nav-main-mega .sub {显示:无;}

main-mega .sub ul {显示:块;}

于 2012-01-16T09:25:19.480 回答
1

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

#menu li ul {display: none;}
#menu .sub ul {display: block;}
于 2013-01-17T11:34:10.163 回答
0

我遇到了同样的问题。我通过将其添加为有关大型菜单的任何 CSS 的第一行来获得菜单以停止闪烁:

.megamenu li > div {display: none}
于 2012-02-14T20:07:17.797 回答
0

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

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

然后添加一些 jQuery 以在文档就绪时再次显示该项目:

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

这将消除闪烁。我在这里尝试了每一个解决方案,没有一个对我有用 100%。这在 IE11 中是这样的。

于 2015-06-09T14:37:39.910 回答
-1

在菜单 CSS 的第一行,您必须使用以下几行:-

#menu li ul {display: none;}
#menu .sub ul {display: block;}
于 2014-03-12T05:58:12.320 回答