<div id="cnblogs_post_body">
看到了淘宝产品介绍中,图片是在下拉滚动条时加载,这是一个很不错的用户体验。减少了页面加载的时间了，也减轻了服务器的压力，就查了下用JQuery..
什么是ImageLazyLoad技术
在页面上图片比较多的时候，打开一张页面必然引起与服务器大数据量的交互。尤其是对于高清晰的图片，占的几M的空间。ImageLazyLoad技术就是，当前可见界面的图片是加载进来的，而不可见页面（通过滚动条下拉可见）中的图片是不加载的，这样势必会引起速度上质的提升。
怎么实现ImageLazyLoad
虽然是很牛X的特效,不过用JQuery插件只需要短短几句代码,使用过程如下:
1.导入JS插件
2.在你的页面中加入如下的javascript：
$("img").lazyload();
这将会使所有的图片都延迟加载。
当然插件还有几个配置项可供设置。
1.改变threshold
$(“img”).lazyload({ : 200 });
把阀值设置成200 意思就是当图片没有看到之前先load 200像素。
图片和自定事件来触发加载图片事件
$("img").lazyload({
placeholder : "img/grey.gif",
: "click"
});
$("img").lazyload({
placeholder : "img/grey.gif",
effect : "fadeIn"
});
图片的延迟加载，对数据同样可以，和就把
LazyLoad技术运用的淋漓尽致；
图片的延迟加载，遇到高度特别高的图片，会出现停止加载的问题；
代码不规范的同学要注意了，不管由于什么原因，如果您的页面中，img标签的height属性未定义，那么我建议您最好不要使用ImageLazyLoad
调用方法也是很简单的：
注：该脚本依赖 yahoo-dom-event,页面中需要加载 yui 2.x,你也可以直接引用下面的地址:
配置参数如下：
manual 模式时，需要手动将页面中需要延迟加载的图片的 src 属性名更改为 data-lazyload-src. 比如 SRP 页面，宝贝列表的后20个图片延迟加载。输出时，html 代码为：
