jquery 延迟加载插件答案

【问题标题】：jquery lazy loading pluginjquery 延迟加载插件
【发布时间】：2013-05-13 12:28:06
【问题描述】：

我正在使用大量图像创建门户。为了流畅，我向这个门户添加了延迟加载插件

这是插件http://www.appelsiini.net/projects/lazyload

我用这段代码初始化插件：

$(function () {
    $("img.lazy").lazyload({
        effect: "fadeIn"
    });
});

图片网址是这样的：

<a href="#">
    <img src="/public/images/dflt_03.jpg" data-original="<?php echo $this->magImg;?><?php echo $top['img_path'];?>" width="180" height="230" alt="cover" class="lazy">
</a>

这非常有效。但我的问题是加载页面后没有显示图像。鼠标滚动后，这将显示图像。我想在滚动之前显示一些图像。

【问题讨论】：

标签： javascript jquery lazy-loading

【解决方案1】：

没有为您的 html 页面提供标记，但是由于延迟加载的概念是图像仅在需要时才加载，即当它们出现在视口中时，可能会触发 scroll 或 resize 事件应该可以工作。在页面加载后尝试任何这些（或者，更好的是，在调用延迟加载完成回调时）：

$("html, body").trigger("scroll");
$(window).trigger("resize");

【讨论】：

【解决方案2】：

查看修复建议here

我检查了插件并在更新方法中更改了这一行：

if (settings.skip_invisible && $this.css('display') === 'none') {
//if (settings.skip_invisible && !$this.is(":visible")) {

【讨论】：