這篇文章將為大家詳細講解有關jQuery中圖片懶加載lazyload.js怎么用,小編覺得挺實用的,因此分享給大家做個參考,希望大家閱讀完這篇文章后可以有所收獲。
lazyload是一個用Javascript編寫的jQuery插件,它可以延遲加載長頁面中的圖片,在瀏覽器可視區(qū)域外的圖片將不會被載入,直到用戶將它們滾動到它們所在的位置。
跟bootstrap一樣,lazyload.js也是依賴于jQuery
與之前的圖片引入路徑不同,真實的圖片路徑不再是用src屬性,而是data-original。src屬性用于引入占位符圖片(當然,個人更推薦占位符不寫在img標簽里)。同時,必須設置img的寬度和高度,給每一個懶加載的圖片加一個class比如.lazy
四大屬性必須同時具備:class data-original width height
要想讓所有class為lazy的圖片懶加載,只需要簡單的一行代碼就可以