手动触发 Lazyload 显示懒加载的图片

简介我们在做网站的时候,经常会对网页上的图片用到Lazyload懒加载,但是也时常会遇到一个问题:当我们在Tab切换中使用Lazyload的时候,会发现tab切换过来之后,图片并不能马上加载,而是需要下拉一下滚动条才能显示图片,否则就会显示一个Lazyload站位的图片(一般为灰色或白色)很影响用户体验。站长图库找了很多资料,最后发现只需要手动触发下绑定窗口的滚动事件重新计算就可以实现手动触发Lazy

  

我们在做网站的时候,经常会对网页上的图片用到Lazyload懒加载,但是也时常会遇到一个问题:

当我们在 Tab 切换中使用Lazyload的时候,会发现tab切换过来之后,图片并不能马上加载,而是需要下拉一下滚动条才能显示图片,否则就会显示一个Lazyload 站位的图片(一般为灰色或白色)很影响用户体验。

站长图库找了很多资料,最后发现只需要手动触发下绑定窗口的滚动事件重新计算就可以实现手动触发Lazyload懒加载事件了。

//监听tab切换,回调中执行以下代码即可:$(window).trigger('scroll');

如:

$('li').on('click',function(e){$(window).trigger('scroll');//触发下绑定窗口的滚动事件重新计算});

以上,就是手动触发 Lazyload 显示懒加载的图片的方法,希望对大家有所帮助!

下载链接:网站源码/小程序源码/网站模板下载

版权声明

   站内部分内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供网络资源分享服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请 联系我们 一经核实,立即删除。并对发布账号进行永久封禁处理。在为用户提供最好的产品同时,保证优秀的服务质量。


本站仅提供信息存储空间,不拥有所有权,不承担相关法律责任。

给TA打赏
共{{data.count}}人
人已打赏
网站技巧

替换uploadify用Huploadify实现上传图片或文件

2024-9-19 19:44:19

网站技巧

WordPress纯代码实现前端页面HTML完美压缩

2024-9-19 19:44:21

0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
搜索