Lazyload图片懒加载

当有大量图片的时候，通过Lazyload图片懒加载插件，会让图片陆续加载，从而提升了页面打开速度，素材火的首页和列表页正式采用的这种方法。

分类：图片代码 > 延迟加载难易：初级

查看演示下载资源下载积分： 26 积分

首先引入jquery库和lazyload插件：

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

接着我们放置多个有图片的列表，注意图片上的属性original，即真正图片的地址，并且每个图片加上了.lazy。

<img src="images/grey.gif" original="http://www.sucaihuo.com/jquery/logo/45/middle.jpg" alt="超炫的弹出层效果Fancybox" class="lazy"  />

jQuery

最后我们对有.lazy的图片进行懒加载：

$(function() {
    $("img.lazy").lazyload({effect: "fadeIn"})
})

看下这个<a href='http://www.sucaihuo.com/jquery/demo/46/' target='_blank'>lazyload懒加载</a><storng>网页特效</strong>吧，突然有点流畅，有点炫哦！~