lazyload.js用于长页面图片的延迟加载,视口外的图片会在窗口滚动到它的位置时再进行加载,这是与预加载相反的。
lazyload.js优点:
它可以提高页面加载速度;
在某些情况清晰它也可以帮助减少服务器负载。
lazyload.js安装:
bower安装:
bowerinstalljquery.lazyload
npm安装:
npminstalljquery-lazyload
lazyload.js使用:
lazyload依赖与jquery。所以先引入jquery和lazyload
1.将图片路径写入data-original属性
2.给lazyload的图片增加一个名为lazy的class
3.选择所有要lazyload的图片(img.lazy),执行lazyload();
$(function(){
$("img.lazy").lazyload();
})
PC端(lazyload)
1、引入js文件
2、html代码