如果你的网站必须有很多图片，那么我们该如何优化呢，没错！就是图片延迟加载技术。现在介绍如下：

工具：jQuery

步骤/方法

第一，该功能主要依靠jQuery，所以首先要下载程序包，在百度里搜索“图片延迟加载　下载”会有很多的下载包。

第二，将文件解压，将Js文件夹所有文件上传至网站根目录，目录形式为：

　　/Js/lazyload/grey.gif

　　/Js/lazyload/jquery.js

　　/Js/lazyload/jquery.lazyload.js

第三，调用方法：

　　在需要用到特效的页面上，加上以下代码

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

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

第四，添加调用代码

　　<script type="text/javascript">

　　$("img").lazyload();

　　</script>

第五，关于图片延迟加载还有很多应用，这里就讲解最基础的，对一般的网站会有很大的帮助。

注意事项

　其中img是延迟加载所有图片，也可以根据不同模板作相应改动，比如我这个主题，可以改成#post img，这样只延迟加载#post 容器内的图片，否则可能影响到侧边图片的加载；

　如果上传路径改变，或者加载时图片打叉，说明图片路径不正确，查找jquery.lazyload.js中的placeholder:，将后面的图片地址换成绝对地址即可！

继续阅读：

原创文章请注明转载自杭州WEB前端外包网站本文地址：http://hz.35ui.cn/post/img.html，标题：图片延迟加载技术提高网页打开速度