var lazyLoadImg = new LazyLoadImg({
el: document.querySelector('#list'),
mode: 'diy', //默認模式,將顯示原圖,diy模式,將自定義剪切,默認剪切居中部分
time: 300, // 設置一個檢測時間間隔
complete: true, //頁面內所有數據圖片加載完成后,是否自己銷毀程序,true默認銷毀,false不銷毀
position: { // 只要其中一個位置符合條件,都會觸發加載機制
top: 0, // 元素距離頂部
right: 0, // 元素距離右邊
bottom: 0, // 元素距離下面
left: 0 // 元素距離左邊
},
diy: { //設置圖片剪切規則,diy模式時才有效果
backgroundSize: 'cover',
backgroundRepeat: 'no-repeat',
backgroundPosition: 'center center'
},
before: function () {
},
success: function (el) {
el.classList.add('success')
},
error: function (el) {
el.src = './images/error.png'
}
})
// lazyLoadImg.start() // 重新開啟懶加載程序
// lazyLoadImg.destroy() // 銷毀圖片懶加載程序
圖片懶加載插件lazy-load-img
最后編輯于 :
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。
推薦閱讀更多精彩內容
- Swift版本點擊這里歡迎加入QQ群交流: 594119878最新更新日期:18-09-17 About A cu...
- 五月底入駐簡書到現在差不多快三個月了,從最初開始的孤軍奮戰到現在認識一群支持我的小伙伴們,感謝簡書這個平臺讓我結識...