jQuery图片延迟加载插件jQuery.lazyload,使用延迟加载在可提高网页下载速度。在某些情况下,它也能帮助减轻服务器负载。
1.lazyload依赖与jquery。所以先引入jquery和lazyload
<script src="jquery.js"></script>
<script src="jquery.lazyload.js"></script>
2.将图片路径写入data-original属性
3.给lazyload的图片增加一个名为lazy的class
4.选择所有要lazyload的图片(img.lazy),执行lazyload();
<img class="lazy" data-original="img/example.jpg" style="margin-top:1000px" height="200">
<script>
$(function(){
$("img.lazy").lazyload();
})
</script>
注意:必须设置图片的高度或者宽度,否则插件可能无法正常工作