官網下載地址：http://plugins.jquery.com/lazyload/

要引入兩個文件，注意這些事html中包含著

<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="js/jquery.lazyload.js"></script>

然后在query.lazyload.js下面配置一下你用到的

<script>
? ?? $(function(){
? ??? $("img.lazy").lazyload({
? ???placeholder:"./img/loading.gif",??? //圖片未加載出來時顯示的占位圖
? ???effect:"show",????????? //展現的方式,常用：show顯示\fadeIn閃現
? ???threshold:100,????? //在距離屏幕多少px時開始加載
? ???event:"scroll",??????? //懶加載的觸發事件,常用：click點擊/mouseover鼠標移入/sporty運動/默認為scroll滑動
? ???container:$("#J-sourceList"),?? //指定容器內的元素產生效果
? ???failure_limit:5??????????????? //加載多少張可見區域外的圖片
? ??});
? ?? })
? </script>

然后建議img的尺寸盡量統一 那樣直接寫一個class完美，因為這個我發現需要給img配置width height不給的話有可能會不加載

轉載于:https://www.cnblogs.com/nannan-0305/p/10955961.html

總結

以上是生活随笔為你收集整理的jquery的懒加载记录一下踩得坑的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。