我正在使用 Fancybox v.1.3.4 在 iframe 中显示视频这一页。 Fancybox 和视频显示良好,但问题是,自从添加代码后,我在 IE7/8 中加载网站时遇到了巨大的停顿,类似于这个问题— 页面加载后,UI 冻结了 4-5 秒,让我无法点击链接、滚动或执行其他操作。这是我在页面顶部的链接<head>
。包含 jQuery UI 包(包括 UI 1.8.11、UI Widget、UI Mouse、UI Position 和 UI Effects w/ Scale)主要是为了启用网站上尚未加载但将会加载的其他效果。
<script type="text/javascript" src="/lib/jquery/jquery-latest.min.js"></script>
<script type="text/javascript" src="/lib/jquery/jquery-ui.custom.min.js"></script>
<script type="text/javascript" src="/lib/fancybox/jquery.fancybox-1.3.4.pack.js"></script>
<link rel="stylesheet" href="/lib/fancybox/jquery.fancybox-1.3.4.css" />
我在页面上使用了 YSlow,它建议将脚本调用移至底部,但这并没有解决 IE 中的暂停问题。然后,我使用 IE8 的开发工具在加载期间查看了 HTML DOM,暂停似乎是在加载 Fancybox 代码时发生的;暂停后,以下 div 立即出现在树的底部:
<div id="fancybox-tmp"/>
<div id="fancybox-loading" (jQuery attribute here)>
...
</div>
<div id="fancybox-overlay"/>
<div class="fancybox-ie" id="fancybox-wrap">
...
</div>
再加上问题是在我将 fancybox 添加到页面后出现的,这就是为什么我认为这是 Fancybox 的性能问题,但到目前为止我尝试过的所有操作(除了关闭 fancybox 代码之外)似乎都没有解决问题。产生了影响。我最近尝试过的事情是删除对 jQuery.ready() 的引用,以防这可能有助于它更早地加载 fancybox 代码,从而改变暂停的时间,但它并没有起到多大作用。并不是我真正期望的,但我对 jQuery 和 Fancybox 有点陌生,此时我正在抓住救命稻草。
我现在的想法是,Fancybox 和页面上的其他脚本之一(例如 Google Analytics)之间可能存在冲突,但我不确定如何判断是否是这种情况,或者如果出现这种情况该怎么办最终就是这样。了解这些脚本的人有什么想法吗?提前致谢。
我之前在fancybox和IE上也遇到过类似的问题。如果您查看 CSS 文件,会发现大量 IE 特定的过滤器:
/* IE6 */
.fancybox-ie6 #fancybox-close { background: transparent; filter:
progid:DXImageTransform.Microsoft.AlphaImageLoader
(src='fancybox/fancy_close.png', sizingMethod='scale'); }
/* and so on */
在我的项目中,我删除了所有这些 IE 特定规则,冻结问题就消失了。
看看是否能解决问题;否则问题可能出在其他地方。
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)