图片懒加载案例

view-source:http://www.w3cways.com/demo/LazyLoad/enabled.html图片图片懒加载的原理是什么呢？

首先把所有图片的标签的src标签设置为通一个空白图片，然后要把需要加载的真实图片地址放置在图片的自定义标签中，然后判断该元素是否出现可视范围中，当出现在页面可视范围中，直接把元素的src修改为正确的路径地址

Demo页面:

基本选项

淡入效果

对不支持JavaScript浏览器的降级处理

水平滚动

容器内水平滚动

容器内垂直滚动

页面内存在N多图片

经过五秒钟的延迟后加载图片

用AJAX来加载图片

http://www.w3cways.com/1765.html

http://www.w3cways.com/demo/LazyLoad/enabled_fadein.html