lazyload插件用于圖片延遲加載，節(jié)省服務(wù)器帶寬，減少服務(wù)器請(qǐng)求次數(shù)，提高網(wǎng)站的頁(yè)面加載速度，用于網(wǎng)站性能優(yōu)化，只有當(dāng)圖片在窗口可視范圍內(nèi)時(shí)才向服務(wù)器請(qǐng)求；

參數(shù)：

threshold：設(shè)置距離窗口底部多少像素開(kāi)始加載圖片，提前加載圖片，

failure_limit：lazyload按照瀑布流加載圖片，當(dāng)找到（按照?qǐng)D片在DOM中的位置從上往下）第一張不在可視范圍的圖片后就停止檢測(cè)延遲加載圖片的位置

如上圖，如果每個(gè)列表塊包含兩張圖片，failure_limit為0時(shí)，當(dāng)頁(yè)面滾動(dòng)到陰影位置時(shí)，只會(huì)加載第一張圖片，因?yàn)榇髨D下的頭像沒(méi)有加載，所以會(huì)停止加載第二行第二列的圖片。所以failure_limit應(yīng)該設(shè)置為一行總顯示圖片的個(gè)數(shù)-1,

event：處理圖片延遲加載的事件，默認(rèn)的是window滾動(dòng)事件，

effect：圖片加載效果，

container：處理圖片延遲加載的容器，用于觸發(fā)綁定事件用，

data_attribute：圖片延遲加載的圖片地址屬性后綴，data為前綴，默認(rèn)為data-original

skip_invisible：用于顯示隱藏的圖片

appear：用于在圖片加載之前到顯示圖片之間的處理函數(shù)，一般用于展示加載動(dòng)畫(huà)，

load：用于圖片加載完畢之后執(zhí)行的函數(shù)，

placeholder：用于顯示圖片之前的圖片占位符，需要知道圖片有寬度和高度

?

標(biāo)注：瀏覽器窗口滾動(dòng)事件的觸發(fā)需要窗口的高度(window.innerHeight或$(window).height())和文檔高度(document.body.clientHeight或$(document).height())相等才能觸發(fā)滾動(dòng)事件，但是如果設(shè)置html,body{height:100%;}，文檔高度和窗口高度一致就無(wú)法觸發(fā)窗口滾動(dòng)事件。

轉(zhuǎn)載于:https://www.cnblogs.com/zhang-jian/p/4569244.html

總結(jié)

以上是生活随笔為你收集整理的jQuery lazyload插件详解和问题解答的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。