博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
iscroll.js和lazyload.js的兼容(滑动时,缓冲好的图片不更新)
阅读量:5826 次
发布时间:2019-06-18

本文共 753 字,大约阅读时间需要 2 分钟。

以前在做项目的时候,把jquery.lazyload.js和iscroll.js一起使用,当滑动页面的时候,iscroll的滑动效果出来了,但是图片懒加载的效果没出来,主要是因为图片缓冲完毕后不能及时刷新

解决两者兼容问题操作:

1、(iscroll.js和lazyload.js的兼容(滑动时,缓冲好的图片不更新)):

onScrollMove: function(){    $("#"+id).trigger('scroll');//iscroller和loadlazy.js图片缓冲完毕后不能及时刷新,加上这个模拟浏览器被滑动,那么图片就可以刷新了}

原理是:只要浏览器滚动,那么图片就会刷新,所以在scroll滚动时模拟浏览器滚动,这个问题就解决了。

另外我的这段代码可谓神来之笔,大家好好看看

2、

//这一步很重要,否则图片不能完成缓冲效果(原理:在src正在加载完后,就设置为可以缓冲。)        $("#storeImgs ul li img").on("load",function(){            $("#storeImgs ul li img").lazyload({                effect: "fadeIn", //加载图片使用的效果(淡入)                threshold : 400    //在离可视区400px以内的图片也开始加载了,提升体验度            });        });

下面先给大家看个全的代码,复制粘贴可直接看到全部效果。

若不能,请自行导入:
jquery-1.7.1.min.js,
jquery.lazyload.js,
iscroll.js三个库。

title

转载地址:http://hlsdx.baihongyu.com/

你可能感兴趣的文章
SQL-15 查找employees表所有emp_no为奇数,且last_name不为Mary的员工信息,并按照hire_date逆序排列...
查看>>
拖动元素的理解
查看>>
mysql 字符集乱码问题
查看>>
【MongoDB学习笔记19】MongoDB的游标和查询选项
查看>>
adb install 和强制安装
查看>>
Mapper多表关联查询学习
查看>>
tomcat常用功能的配置方法
查看>>
我的友情链接
查看>>
微信小程序开发入门
查看>>
linux screen 命令行终端切换
查看>>
【转】Notice: A session had already been started – ignoring session_start()...
查看>>
加入域时出现以下错误:找不到网络路径
查看>>
【C#】protected 变量类型
查看>>
Shell下支持变量的重复字符串
查看>>
Ubuntu解压
查看>>
爬虫_房多多(设置随机数反爬)
查看>>
藏地密码
查看>>
我的友情链接
查看>>
Oracle字符集详解
查看>>
CCNA学习指南 第九章 下载
查看>>