一般而言，商城一般是展示型的网站，首页和列表页的内容图片会比较多，在加载的时候，原则上是都需要加载，这样一个网页才显示完整，这样就回造成显示慢，不能及时看到效果。如果在页尾需要再加js，那么最后的这些js文件的加载可能会受影响。如何让页面打开速度更快呢？下面咔优CARTYOU在这里与大家分享怎么使用LAZYLOAD延迟加载技术实现图片的延时加载。
看了解下什么是LazyLoad：
Lazyload是通过延迟加载来实现按需加载，达到节省资源，加快浏览速度的目的。网上也有不少类似的效果，这个Lazyload主要特点是：支持使用window（窗口）或元素作为容器对象；对静态（位置大小不变）元素做了大量的优化；支持垂直、水平或同时两个方向的延迟。由于内容比较多，下一篇再介绍图片延迟加载效果。兼容：ie6/7/8, firefox 3.5.5, opera 10.10, safari 4.0.4, chrome 3.0
基本原理：
首先要有一个容器对象，容器里面是_elems加载元素集合，用隐藏或替换等方法，停止元素加载内容。然后历遍集合元素，当元素在加载范围内，再进行加载，加载范围一般是容器的视框范围，即浏览者的视觉范围内。当容器滚动或大小改变时，再重新历遍元素判断，如此重复，直到所有元素都加载后就完成。
加载数据：
当容器滚动或大小改变时，就会通过事件绑定（例如scroll/resize）自动执行_load加载程序。如果不能绑定事件（如resize），应手动执行load或resize方法。当容器大小改变（resize）时，还需要先执行_getContainerRect程序获取视框范围。要获取视框范围，一般元素可以通过_getRect方位参数获取程序来获取。
具体使用：
给所有图片定义一个src2属性，当屏幕滚动当前图片位置的时候将src2赋值给src。
示范：
大家试下，如有不明白的，欢迎与CARTYOU探讨！
