Question

我已经开始在我的网站上实现延迟加载程序了。在这里查看沙箱：

http://www.brencecoghill.com/projects/north-vietnam/

以下文字被添加到我的同位素中以使其工作（以及必要的html并从标题链接到库）：

$("img").lazyload({
    event : 'scroll',
    effect : 'fadeIn',
    appear: function(){
    }
});

这似乎在firefox中运行良好，但在IE中完全失败（我使用版本8测试） - 只显示灰色框。

如何修复此问题才能在IE中使用？（至少版本8或更高版本）
有没有办法设置lazyloader以便它很好地降级？

仅供参考我使用这些链接来弄清楚如何实现这个： http://www.appelsiini.net/projects/lazyload

Combining jQuery Isotope and Lazy Load

http://jsbin.com/ajoded

http://jsfiddle.net/wN6tC/73/

编辑：我删除了尝试写入上述控制台的行。关于修复我得到的其他脚本错误的其他任何建议？

Answer 1

现在你删除了console但你仍然有js错误，在IE中工作正常。我不确定为什么会发生错误，也许是jQuery.noConflict();

IE：

SCRIPT5002: Function expected 
animate-bg.js, line 8 character 1

铬：

Uncaught TypeError: object is not a function animate-bg.js:71 (anonymous function)
animate-bg.js:71

回答第二个问题..

有没有办法设置lazyloader以便它很好地降级？

您可以按照“Fallback for Non JavaScript Browsers”的说明进行操作。这基本上是为这样的图像设置代码：

<img class="lazy" src="img/grey.gif" data-original="img/example.jpg"  width="640" heigh="480">
<noscript><img src="img/example.jpg" width="640" heigh="480"></noscript>

然后添加一些CSS来隐藏

 .lazy { display: none; }

当页面的jquery加载时，立即调用类似的内容再次显示图像。

$("img.lazy").show().lazyload();

延迟加载和同位素 - 在Firefox中工作，但不是IE

1 个答案: