jquery插件实现图片延迟加载

jquery插件实现图片延迟加载 — jquery.lazyload

1.导入JS插件

<script src=”jquery.js” type=”text/javascript”></script>
<script src=”jquery.lazyload.js” type=”text/javascript”></script>

2.在你的页面中加入如下的javascript：

$(“img”).lazyload();

这将会使所有的图片都延迟加载。

当然插件还有几个配置项可供设置。

1.改变threshold

$(“img”).lazyload({ threshold : 200 });

把阀值设置成200 意思就是当图片没有看到之前先load 200像素。

2.当然了你也可以通过设置占位符图片和自定事件来触发加载图片事件

$(“img”).lazyload({
placeholder : “img/grey.gif”,
event : “click”
});

3.可以通过定义effect 参数来定义一些图片显示效果

$(“img”).lazyload({
placeholder : “img/grey.gif”,
effect : “fadeIn”
});