3

我正在使用 Fancybox v.1.3.4 在此页面的 iframe 中显示视频。Fancybox 和视频显示正常,但问题是,自从添加代码后,我在 IE7/8 中加载网站时出现了巨大的停顿,类似于这个问题- 页面加载,然后 UI 冻结持续 4-5 秒,阻止我点击链接、滚动或其他任何内容。这是我在页面顶部链接的内容,在<head>. 包含 jQuery UI 包(包括 UI 1.8.11、UI 小部件、UI 鼠标、UI 位置和带有缩放的 UI 效果)主要是为了启用尚未加载到站点上但将加载的其他效果。

<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代码)似乎有产生了影响。我尝试的最新方法是删除对 j​​Query.ready() 的引用,以防它更早地加载 fancybox 代码,从而改变暂停的时间,但它并没有起到太大的作用。并不是我真的期望它,但我对 jQuery 和 Fancybox 有点陌生,此时我正在抓住稻草。

我现在在想的是,这可能是 Fancybox 与页面上的其他脚本之一(例如 Google Analytics)之间的冲突,但我不确定如何判断是否是这种情况,或者如果是这种情况该怎么办最终就是这样。了解这些脚本的人有什么想法吗?提前致谢。

4

3 回答 3

6

我以前在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 特定规则,并且冻结问题消失了。看看能不能解决;否则问题可能出在其他地方。

于 2011-05-18T20:00:53.717 回答
0

你可以使用 firebug 来分析你的代码

于 2011-05-18T20:00:29.807 回答
0

我在 IE 中也遇​​到了 Fancybox 的问题。对我来说,这是 v1.6.0 中引入的 jQuery 中的一个错误。升级到最新的 jQuery 版本 (1.6.4) 解决了这个问题。

Fancybox google 组的更多详细信息

于 2011-10-11T00:34:22.677 回答