jQuery Lazy - 一次加载所有图像答案

【问题标题】：jQuery Lazy - loading all images at oncejQuery Lazy - 一次加载所有图像
【发布时间】：2019-06-29 13:01:08
【问题描述】：

我正在整理一个包含一些相当大的 GIF 的画廊。我认为最好在加载时尝试显示预加载器并仅加载可见图像。为此，我找到了 jQuery Lazy：http://jquery.eisbehr.de/lazy/

我遇到的问题是所有图像似乎都是一次加载，我有点不知道为什么！？！你可以看到我在这里得到了什么：http://psychro.me/work/

非常感谢任何帮助。非常感谢。

【问题讨论】：

标签： jquery lazy-evaluation

【解决方案1】：

如文档中所写：（根据http://jquery.eisbehr.de/lazy/example_delayed-loading）

...Lazy 使用延迟时间在页面加载后一次加载所有图像，而不是只加载视图中的元素...

所以我认为，如果您删除网站上使用的“延迟”属性（为测试而添加评论），则不会立即加载所有图像。

您网站上的代码：

$(function() {
    $('.lazy').lazy({

        beforeLoad: function(element) {
            var imageSrc = element.data('src');
            console.log('image "' + imageSrc + '" is about to be loaded');
        },
        scrollDirection: 'vertical',
        delay: 1000, // For testing
        effect: "fadeIn",
        effectTime: 1000,
        threshold: 0
    });
});

正确形式：

$(function() {
    $('.lazy').lazy({

        beforeLoad: function(element) {
            var imageSrc = element.data('src');
            console.log('image "' + imageSrc + '" is about to be loaded');
        },
        scrollDirection: 'vertical',
        effect: "fadeIn",
        effectTime: 1000,
        threshold: 0
    });
});

【讨论】：

哇，好简单！我完全错过了。非常感谢。 ?
@user1549184 不客气，如果有用，请给这个答案投票。