js圖片懶加載（滾動加載）判斷是否生效

一、什么是懶加載？

　　對未出現在視野范圍內的圖片先不進行加載，等到出現在視野范圍才去加載。

二、為什么使用懶加載？

　　懶加載的主要目的是作為服務器前端的優化，減少請求數或延遲請求數。

理論性知識大家都有自己的獲取渠道，不多說，下面看具體內容

引入js文件  jquery.lazyload.js

<script type="text/javascript" src="__ROOT__/Public/admin/lib/jquery/lazyload/jquery.lazyload.js"></script>

HTML頁面

<img class="lazy imgShow" src="{$val.sharingimg}" width="50px;">

<script>
    $(document).ready(function(){
        $("img.lazy").lazyload({
            effect : "fadeIn",
            failurelimit : 3    //failurelimit : 10 在找到10張不在可視范圍內的圖片時停止執行
        });
    });
</script>

測試

打開Google Chrome        Network選項 Slow 3G

看下我的測試結果

1、打開頁面 看下加載的內容

2、下拉后，對比下 

以上就是全部內容，如有錯誤，還請指正，謝謝。