jquery.lazyload.js下载以及 图片延迟加载的使用

图片延迟加载,网上有很多资料,但是我找jquery.lazyload.js找了很久没发现,而且很多地方的js不对,

想来想去这个应该也是jquery的一个插件,于是搜索jquery的所有插件,终于发现了,下载地址如下:

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

这个是最新版本的jquery.lazyload.js

下面来介绍下使用方法:

 

首先引入所需js

<scriptsrc="jquery-1.7.2.js"type="text/javascript"></script>

注:我用的是最新版本的jquery核心库
<scriptsrc="jquery.lazyload.js"type="text/javascript"></script>

 

然后将<img>文件改变

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

src是用于占位的图片 data-original是真实图片地址

 

最后写js代码

$("img").lazyload();

 

或者延迟指定时间加载(这里是5000)

$(function() {         
    $("img").lazyload({
        event : "sporty"
    });
});
$(window).bind("load", function() {
    var timeout = setTimeout(function() { $("img").trigger("sporty") }, 5000);
});

 

 

参考与

http://www.appelsiini.net/projects/lazyload