Javascript “imageflow” IE 无法加载，在其他浏览器中运行缓慢答案

【问题标题】：Javascript "imageflow" IE not loading, slow in other browsersJavascript “imageflow” IE 无法加载，在其他浏览器中运行缓慢
【发布时间】：2014-03-19 06:32:33
【问题描述】：

我正在使用一个名为ImageFlow 的javascript 脚本。它在 FF/Chrome 中运行良好，但是非常缓慢且很麻烦。

在 IE (9,8,7) 中，它根本拒绝加载。没有 JS 问题，我不能发布代码，因为代码太多，我也没有编写任何网站，所以不知道是什么触发了它出错。

演示站点是http://crofts.propertylogic.net，图像流的JS可以在http://crofts.propertylogic.net/coverflow/imageflow.js找到。如您在 chrome/ff 上所见，该效果旨在与团队成员一起插入页面中间的白框。如果有人能指出我正确的方向，那就太好了。

【问题讨论】：

标签： javascript performance internet-explorer imageflow

【解决方案1】：

我无法为您修复代码，但我可以基本上告诉您为什么它在 IE9 中不起作用。找到 'myImageFlow' div 的 init 事件在该 div 被读入 DOM 之前发生。我相信这是因为 ImageFlow 插件模仿 IE 的 DOMContentLoaded 事件的方式。 ImageFlow 插件使用自 08 年 5 月以来未更新的 DOMContentLoaded plugin。我敢打赌，这个库已经过时了，因此它破坏了 ImageFlow，它看起来也很过时了。

老实说，我建议您寻找更现代的插件。如果这没有帮助，试着弄乱 DOMContentLoaded 部分，看看你是否能弄清楚为什么它在 IE9 中没有足够长的延迟（使用调试器 F12）。

【讨论】：

我认为jcarousel 可能是一个不错的选择，如果 OP 采用新的插件路线。我用它做了几次几乎相同的旋转器。
好发现，会调查它。谢谢

【解决方案2】：

如果您没有为任何网站编写代码，则很可能您也没有在该网站上安装 imageflow。但是安装已经涵盖了，对吧？也可能不是！

http://finnrudolph.de/ImageFlow/Installation

<div id="unique_name" class="imageflow"> 
    <img src="dir/image_1.jpg" longdesc="URL_1" width="w_1" height="h_1" alt="Text_1" />
</div>

必须在 XHTML 中设置图像宽度和高度参数（w_x 和 h_x），才能与 Internet Explorer 完全兼容。为。。。道歉这种额外的工作量 - 除了微软的 Internet 之外的所有浏览器 Explorer 可以通过 JavaScript 获取正确的图像尺寸！

这意味着您是否必须将图像尺寸插入服务器端的 xhtml 中，即我认为。目前正在这样做吗？

【讨论】：

谢谢@octopi，但这似乎不起作用:(自己看看。再次感谢
是的，我正在讨论它的范围，我会进行更深入的研究。

【解决方案3】：

在 IE8 上查看了网站，似乎在动画位上运行良好，只有图像看起来垂直拉伸。

【讨论】：

谢谢..它对我来说已经工作了几次，但是刷新页面会引发问题。
是的，我也遇到了同样的问题，当导航到主页时，图像根本无法加载。该问题特定于 IE8，而不是 Chrome 或 IE6
奇怪的是 IE6 可以工作。另请注意，IE9 中出现此问题，但 IE10pp 中没有，感谢您回复我@DP

【解决方案4】：

你可以使用 jQuery 来解决这个问题 - 都是正确的 dom 处理程序是问题所在。

$(document).ready() is the key

$(document).ready(function()
{
    var circular_3 = new ImageFlow();
    circular_3.init({ ImageFlowID: 'imageflow1',
        //circular: true,
        reflections: false,
        reflectionP: 0.4,
        slider: false,
        captions: false,
        opacity: true,
        xStep: 250,
        imageFocusM: 1.5,
        startID: 2
    });

【讨论】：

【解决方案5】：

我知道现在回答这个问题有点晚了。 InvisibleBacon 是正确的，因为 domReady 代码自 2008 年以来没有被修改，但我检查了 domReady 代码，它确实适用于 IE 5 到 11、Firefox、Chrome、Mobil Chrome、Safari 和 Mobile Safari。我没有用 Opera 检查代码。

在这种情况下，我会说问题出在您使用的 imageflow.js 代码上，我看到您不再使用它。

【讨论】：