简单用例:
<script src=”jquery.js”></script>
<script src=”jquery.lazyload.js”></script>
<img class=”lazy” data-original=”img/example.jpg” width=”640″ height=”480″>
$(function() {
$(“img.lazy”).lazyload();
});
配置项说明:
$(function() {
$(“img.lazy”).lazyload({
placeholder : “img/default.gif”,//当图片还没有加载出来的时候默认占位图片,加载出来后自动隐藏。
threshold : 200,//默认是当图片到可视窗口时加载,但可以自定义距离可是窗口多少像素的时候开始加载,这里设置200px。
event : “click”,//默认的加载出发事件是滚动到可视窗口,当然你可以使用click,mouseover等事件,也可以自定义事件触发加载。
effect : “fadeIn”,//默认是调用show()的方法,这里你可以自定义。
failurelimit : 10,//lazyload默认在找到第一张不在可见区域里的图片时则不再继续加载,但当HTML容器混乱的时候可能出现可见区域内图片并没加载出来的情况,failurelimit意在加载N张可见区域外的图片,以避免出现这个问题。
});
});
官网说明:http://www.appelsiini.net/projects/lazyload
转载请注明:苏demo的别样人生 » jquery lazyload 延迟加载