如果單一頁面圖片的量太大時,讀圖必須讀很久,lazyload的功用就是將圖片延後讀取,不用因為圖片還沒load完就讓網頁卡住
HTML
<!-- 將圖片路徑設定在data-original屬性上,src則可以放單色暫時顯示的圖 --> <img class="lazy" src="img/grey.gif" data-original="img/example.jpg">
jQuery
//當圖片進入到使用者視窗範圍時,fadeIn讀入 $('img.lazy').lazyload({effect : "fadeIn"});