jquery实现图片延迟加载

js:

<script type="text/javascript" charset="utf-8">

      $(function() {

          $("img").lazyload({ 

          placeholder : "images/loading.gif",

                 effect: "fadeIn"

           });  

      });

</script>

<style>

img a,img{border:0px;}

div{ margin-bottom:10px;}

</style>

<img src="images/0.jpg" /><br />

<div><a href="#"><img src="images/loading.gif" data-original="images/1.jpg"></a></div>

<div><a href="#"><img src="images/loading.gif" data-original="images/2.jpg"></a></div>

<div><a href="#"><img src="images/loading.gif" data-original="images/3.jpg"></a></div>

<div><a href="#"><img src="images/loading.gif" data-original="images/4.jpg"></a></div>

<div><a href="#"><img src="images/loading.gif" data-original="images/5.jpg"></a></div>

<div><a href="#"><img src="images/loading.gif" data-original="images/6.jpg"></a></div>

<div><a href="#"><img src="images/loading.gif" data-original="images/7.jpg"></a></div>

<div><a href="#"><img src="images/loading.gif" data-original="images/8.jpg"></a></div>

<div><a href="#"><img src="images/loading.gif" data-original="images/9.jpg"></a></div>

<div><a href="#"><img src="images/loading.gif" data-original="images/10.jpg"></a></div>