python 什么是 懒加载 lazy load

发布网友 发布时间：2022-04-26 00:22

我来回答

共1个回答

热心网友 时间：2022-04-20 10:47

云联负责任告诉给财富值太少

1.用说肯定导入JS插件

页面加入javascript：

2.想提载入图片使用 threshold 进行设置例含义：图片距离屏幕180px提前载入
$(img.lazy).lazyload({ threshold :180});
自定义简单浅色或灰色系图片（越越1*1px佳格式推荐采用gif）作占位图片触发加载作
事件触发jQuery任何事件（click、mouseover）使用自定义事件
例：处于等待状态, 直浏览者滚窗口图片所位置占位图片点击前加载图片, 做:

$(img).lazyload({
placeholder : img/grey.gif,
event : click
});
3.图片完全加载候默认使用show()显示图片所面基本设置示例未写show(),照运行
图片淡入（FadeIn）效$(img.lazy).lazyload({
effect : fadeIn
});
Lazyload图片淡入效演示
图片放特定容器

先看示例：水平滚演示页面垂直滚演示页面

CSS部示例

#container {
height: 600px;
overflow: scroll;
}

js部示例

$(img.lazy).lazyload({
container: $(#container)
});

图片未按顺序排列情况

滚页面候Lazyload按照HTML代码顺序先视范围内加载图片第张视范围内图片处停止执行某些页面布局种聪明假设能立用failurelimit控制加载作：

$(img.lazy).lazyload({
failure_limit : 10
});

面意思：找10张视范围内图片停止执行额吧页面布局猥琐10足满足候再些吧
Lazyload定延迟图片载入

Lazyload并完备功能并影响使用实际用途并用途描述：页面见图片载入定间内载入图片Lazyload定延迟图片载入示例

$(function() {
$(img:below-the-fold).lazyload({
event : sporty
});
});
$(window).bind(load, function() {
var timeout = setTimeout(function() {$(img.lazy).trigger(sporty)}, 5000);
});

例采用参数或者说定5秒
加载隐藏图片

页面能隐藏见图片用作特殊用途Lazyload默认忽略些图片想忽略掉：

$(img.lazy).lazyload({
skip_invisible : false
});

看篇文章能更新版本请百度搜索Lazyload解更则经验通希望家能够我补充足处谢谢
兼容于：OSX平台： Safari 5.1, Safari 6, Chrome 20, Firefox 12
WIN平台：Chrome 20, IE 8 and IE 9 on Windows

iPhone iPad：Safari 5.1