jQuery lazyLoad.js插件 是一款基于jquery框架，可以“實現”圖片延遲加載的插件。請注意，我用了雙引號，因為從我自己實際調試的結論來說呢，并不會延遲加載，而是先下載，然后通過改變<img>的src屬性來隱藏原來的圖片。
我們先來看看他的代碼吧！

復制代碼 代碼如下:

<script type="text/javascript" src="/static/jssrc/lazyload.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#team_main_side img").lazyload({
placeholder : "/static/theme/xituan/img/img_loading.gif",
effect : "fadeIn"
});
});
</script>

修改成
<img original="http://vevb.com/upload/201010122047211034.jpg" src="http://vevb.com/img/img_loading.gif" />

最后記得插入js代碼

[code]
<script type="text/javascript" src="/js/jquery.js"></script><!--jquery 包-->
<script type="text/javascript" src="/js/jquery.lazyload.js"></script><!--lazyload 插件-->
<script type="text/javascript"> //初始化代碼
$(document).ready(function(){
$("#team_main_side img").lazyload({
placeholder : "http://vevb.com/img/img_loading.gif",
effect : "fadeIn"
});
});
</script>

這樣所有圖片就都顯示img_loading.gif了,由于都是請求的同一個圖片,瀏覽器只會請求一次..對于減少服務器http請求來說,我們的目標已經達到了.當瀏覽器滾動到圖片的位置時候，就會把圖片加載進來。