lazyload用来加载比较长的页面中的图片,直到下拉到显示他们为止,页面太长的时候使用它可以加快页面显示的速度。
1.使用它
使用它只需要引用两个文件,如下:
<script src="jquery.js"></script> <script src="jquery.lazyload.js"></script>
还要在img的标签中添加一个属性,还要给这个img添加一个名字,代码如下:
<img class="lazy" src='../../images/defaultpic.jpg' data-original="img/example.jpg" width="640" height="480"> $(function() { $("img.lazy").lazyload(); });
2.添加一个阀值
可以让它在还未显示在屏幕上之前先记载200个像素,代码如下:
$("img.lazy").lazyload({ threshold : 200 });
3.事件出发
使用click或者onmouseover触发加载
$("img.lazy").lazyload({ event : "click" });
作者:Tyler Ning
出处:http://www.cnblogs.com/tylerdonet/
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,如有问题,可以通过以下邮箱地址williamningdong@gmail.com
联系我,非常感谢。