首页 > 教程 >
手动触发 Lazyload 显示懒加载的图片
2023-02-14教程围观次
简介我们在做网站的时候,经常会对网页上的图片用到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 显示懒加载的图片的方法,希望对大家有所帮助!
下载链接:网站源码/小程序源码/网站模板下载
下载排行
- 游戏陪玩语音聊天系统3.0商业升级独立版本源码
- 全新UI基于Thinkphp的最新自助打印系统/云打印小程序源码/附教程
- PHP仿网易云原创音乐分享平台网站源码
- 苹果CMS影视系统成品站打包源码+电影先生6.1.1模板优化版+15W数据
- 英皇cms影视网站系统源码/多种模板+自带采集+支持APP
- 主题巴巴WordPress主题合辑打包下载+主题巴巴SEO插件
- 狂雨小说系统带全部插件/真正可以运营的小说站点系统源码
- 最新版手机软件App下载排行网站源码/App应用商店源码
- 织梦蓝色简洁大气电脑操作系统软件下载网站模板 带手机版
- 最新720全景云系统/可生成小程序+带PC端+安装教程/价值800元的720云全景系统源码