插件描述：超简单图片延迟加载js插件
更新时间：2018/7/23 上午12:1:43
更新说明：修改不能正常访问的图片路径。
EasyLazyload.js
超级好用的js 图片延迟加载插件
使用方法
引入 EasyLazyload.js
将图片 src 替换为 data-lazy-src
<img data-lazy-src="..." />
调用全局方法
lazyLoadInit(）
使用须知
引入 EasyLazyload.js 前需要引用 jquery && zepto
需要在开启服务下运行
参数列表
示例代码
<script>
lazyLoadInit({
coverColor:"white",
coverDiv:"<h1>test</h1>",
offsetBottom:0,
offsetTopm:0,
showTime:1100,
onLoadBackEnd:function(i,e){
console.log("onLoadBackEnd:"+i);
}
,onLoadBackStart:function(i,e){
console.log("onLoadBackStart:"+i);
}
});
</script>coverColor：图片即将显示时覆盖层的颜色
coverDiv：图片即将显示时覆盖层可显示的土自定义组件
offsetBottom：图片距离屏幕底部出现时间点的距离差值（注解：延迟加载图片会在图片顶部接触屏幕底部时出现，如果想要让图片顶部距离屏幕底部有一定距离时出现，请设置此值）
offsetTopm：图片距离屏幕底部出现时间点的距离差值（注解：同上，距离顶部）
onLoadBackEnd：图片已经完全出现时的回调函数，参数为（index，event）加载的图片下标，以及dom对象（dom对象为jquerydom或zeptodom对象）
onLoadBackStart：图片已经下载完成，即将开始显示时的回调函数（参数同上）
EasyLazyload.js 优点
EasyLazyload.js 是真延迟加载 而且不会对样式有任何影响。
队列式加载，不会影响页面效率。
不需要设置任何宽高，简单易用
PREVIOUS:
NEXT:
相关插件-加载
讨论这个项目（55）回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约
chasing 0
2022/11/29 16:34:52
-
有点bug，有轮播图的话有点时候轮播图里面有的载不出来
为欢几何0
2024/6/4 20:15:40
-
可以加载出来，就是网页默认给我变大了一点，导致我的固定定位的侧边栏显示不全
Prvyx 1
2021/11/15 14:40:37
对于ajax的url图片的懒加载，作者在Github上进行了更新，多了个lazyLoadAgain()函数添加在ajax的success中
Github地址：
https://github.com/channg/EasyLazyload.js
自己的demo：
在success函数中，
let $img=$("<img data-lazy-src='/voteSystem_war_exploded"+rs.data[i].picUrl+"'>",{});
lazyLoadAgain();即可
初柒??.0
2022/4/18 19:18:50
-
有的加载不了
小土土 0
2020/4/24 19:01:46
-
为什么有的图片显示正常，有的图片他会把图片src解析成乱码？？
Panda丶0
2020/8/4 19:46:49
-
我也是 为啥呢？
天晴时’微笑0
2020/12/11 19:26:36
-
我也是，不知道为啥
花开富贵0
2021/3/26 11:09:01
-
原来不止我一个😵
七十与你0
2021/4/22 20:23:08
-
没看到评论,原来不止我一个,奇怪的是,视频素材里面可以加载,到自己代码里面就出现图片不全
花开?花落ω终败0
2021/4/23 20:30:24
-
我也是这样不知道为什么
cctvxt0
2022/5/14 16:05:45
-
作者有更新 看第一个可以了
远道0
2022/9/3 11:39:35
-
有轮播图的话，可以把轮播图删除就可以加载出来了
ww535695762 0
2019/5/12 11:06:04
-
我看懂了代码 挺好用的不懂可以问我
@南瓜屋i0
2019/7/26 16:59:24
-
我想让他每次调用 i 都从0 开始怎么弄
，0
2019/9/5 22:56:20
-
ajax里怎么出不来
天晴时’微笑0
2020/12/11 19:26:08
-
为什么我的图片一部分可以显示一部分无法显示
😃
- 😀
- 😉
- 😥
- 😵
- 😫
- 😘
- 😡
- 👍
- 🌹
- 👏
- 🍺
- 🍉
- 🌙
- ⭐
- 💖
- 💔
😃
取消回复
- 😀
- 😉
- 😥
- 😵
- 😫
- 😘
- 😡
- 👍
- 🌹
- 👏
- 🍺
- 🍉
- 🌙
- ⭐
- 💖
- 💔
