使用jquery.lazyload实现图片懒加载

在长页面中经常会用到图片懒加载，图片懒加载能够在用户浏览的同时加载图片。不影响页面渲染速度，节省带宽。

①引入js文件

<script type="text/javascript" src="https://github.com/helijun/documents/blob/master/plugin/lazyLoad/jquery.lazyload.js"></script>

②HTML(此处的src为占位图)

<img alt="" src="/img/lazyload_placeholder.png" data-original="真实url">

③配置参数

$(document).ready(function() {     
            $("img.lazy-load").lazyload({ 
　　　　　　　　　　effect : "fadeIn", //渐现，show(直接显示),fadeIn(淡入),slideDown(下拉)
　　　　　　　　　　threshold : 180, //预加载，在图片距离屏幕180px时提前载入
　　　　　　　　　　event: 'click',  // 事件触发时才加载，click(点击),mouseover(鼠标划过),sporty(运动的),默认为scroll（滑动）
　　　　　　　　　　container: $("#container"), // 指定对某容器中的图片实现效果
　　　　　　　　　　failure_limit：2 //加载2张可见区域外的图片,lazyload默认在找到第一张不在可见区域里的图