bLazy.js 輕量級支持響應(yīng)式圖片的lazyLoad腳本

投訴報錯

腳本大小：15KB
腳本語言：簡體中文
腳本類型：國產(chǎn)軟件
腳本授權(quán)：免費軟件
腳本類別：ajax/javascript
應(yīng)用平臺：javascript
更新時間：2016-07-07
網(wǎng)友評分：

360通過騰訊通過金山通過

15KB

詳情介紹

bLazy 是一個不依賴于第三方JS庫（如 jQuery）的lazyLoad腳本，壓縮版只有幾Kb，而且支持根據(jù)不同的設(shè)備寬度顯示不同大小的圖片，這個功能對于響應(yīng)式開發(fā)非常有用，也是推薦的主要原因。可喜的是，這么好的腳本，支持所有主流的瀏覽器，包括 IE7+。

下面的樣例代碼的功能就是，當(dāng)設(shè)備寬度小于 420px 的時候，就加載小圖片，否則加載大圖片，同時，圖片加載后移除加載器。

HTML:
<img class="b-lazy"
src="placeholder-image.jpg"
data-src="image.jpg"
data-src-small="small-image.jpg"
alt="Image description" />

JavaScript:

var bLazy = new Blazy({
breakpoints: [{
width: 420 // Max-width
, src: 'data-src-small'
}]
, success: function(element){
setTimeout(function(){
// We want to remove the loader gif now.
// First we find the parent container
// then we remove the "loading" class which holds the loader image
var parent = element.parentNode;
parent.className = parent.className.replace(/\bloading\b/,'');
}, 200);
}
});

lazyload

下載地址

下載錯誤？【投訴報錯】