Jquery延迟加载插件

jquery lazy loading plugin

本文关键字：插件 延迟加载 Jquery      更新时间：2023-09-26

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

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

我使用以下代码初始化插件:

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

图片url如下:

<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>

这工作得很好。但我的问题是，加载页面后没有图像显示。鼠标滚动后，将显示图像。我想在滚动前先展示一些图片

您的html页面没有提供标记，但是由于延迟加载的概念是图像只在需要时加载，即当它们出现在视口时，可能会触发滚动或resize事件在窗口或主体上应该工作。在页面加载之后(或者，更好的是，在调用延迟加载完成回调时)尝试这些操作:

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

查看修复建议

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

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