簡介

lazyload.js用於長頁面圖片的延遲加載，視口外的圖片會在窗口滾動到它的位置時再進行加載，這是與預加載相反的。

使用

lazyload依賴與jquery。所以先引入jquery和lazyload

<script src="jquery.js"></script>
<script src="jquery.lazyload.js"></script>

1.將圖片路徑寫入data-original屬性
2.給lazyload的圖片增加一個名為lazy的class
3.選擇所有要lazyload的圖片（img.lazy），執行lazyload();

<img class
 
="lazy" data-original="img/example.jpg" style="margin-top:1000px" height="200">
<script>
    $(function(){
        $("img.lazy").lazyload();
    })
</script>

註意：必須設置圖片的高度或者寬度，否則插件可能無法正常工作

圖片懶加載之lazyload.js插件使用