吕神的自我修养

图片延迟加载插件Jquery LazyLoad

jquery.lazyload.js 是 基于 jQuery 的图片延迟加载插件，在用户滚动页面到图片之后才进行加载,对于有较多的图片的网页，使用图片延迟加载，能有效的提高页面加载速度。
使用方法：
载入 JavaScript 文件

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

修改 HTML 代码中需要延迟加载的 IMG 标签

<img class="lazy" src="img/grey.gif" data-original="img/example.jpg" width="640" heigh="480">

调用 Lazy Load

$("#show-housedata").find("img").lazyload({effect:"fadeIn"})

    或

$(function() {
    $("img.lazy").lazyload({
        threshold:0,    //灵敏度。默认为 0 表示当图片出现在显示区域中的立即加载显示.
        failure_limit:0,//容差范围,检查是否在显示区域内.
        event:"scroll",//触发加载的事件.
        effect:"fadeIn",//加载使用的动画效果，如 show, fadeIn, slideDown 等jQuery自带的效果.
        effectspeed:5,//动画时间.
        container:$('.content'),//父容器。延迟加载父容器中的图片.
        data_attribute:"original",    //真实图片地址的 data 属性后缀.
        skip_invisible:true,//跳过隐藏的图片.
        appear:null,    //图片加载时的事件,参数:elements_left(未加载的图片数量)、settings.
        load:null//图片加载后的事件,参数同appear.
    });
})

官方网站：http://www.appelsiini.net/projects/lazyload

下载地址：

http://www.appelsiini.net/projects/lazyload/jquery.lazyload.min.js

https://raw.githubusercontent.com/tuupola/jquery_lazyload/master/jquery.lazyload.min.js

https://raw.githubusercontent.com/tuupola/jquery_lazyload/master/jquery.lazyload.js