程式猿日常

快過年了！

引入jquery.lazyload.lz.js

例如：

<img src="occupying270.png" data-original="4304485231505859.jpg" webp="true">

img標籤增加webp 屬性 控制是否使用webp模式

webp="true" ，該img路徑使用webp格式模式，判斷客戶端是否相容webp格式，如果客戶端相容webp格式，該img路徑使用data-original替換.jpg或.jpeg 為.webp路徑，如果不相容使用data-original設定的路徑。

webp="false" 或 webp屬性未設定，該img路徑使用data-original設定的路徑。
 

圖片懶載入使用方式參考jquery懶載入事例

$("img").lazyload({   
    threshold : 200,  
    effect: "fadeIn"  
});