JavaScript映像消極式載入庫Echo.js，javascriptecho.js

JavaScript映像消極式載入庫Echo.js，javascriptecho.js

Echo 是一個獨立的 JavaScript 懶載入映像的工具，快速、體積小（不足1k）和使用 HTML5 的 data- 屬性。Echo 支援 IE8+ 。

外掛程式描述：和 Lazy Load 一樣，Echo.js 也是一個用於映像消極式載入 JavaScript。不同的是 Lazy Load 是基於 jQuery 的外掛程式，而 Echo.js 不依賴於 jQuery 或其他 JavaScript 庫，可獨立使用。並且 Echo.js 非常小巧，壓縮後不足 1KB。

相容性

Echo.js 使用了 HTML5 的 date 屬性，並且需要擷取該屬性的值，所以它並不相容 IE6、IE7。雖然 Lazy Load 也使用了 HTML5 的 date 屬性，但它擷取值的方法不一樣。

使用方法

　　1、引入檔案

複製代碼 代碼如下:
<script src="js/echo.min.js"></script>

　　2、HTML

複製代碼 代碼如下:
<img src="images/blank.gif" alt="pic" data-echo="img/pic.jpg" width="640" height="480">

blank.gif 是一個 1 x 1 的圖片，用做預設圖片，data-echo 的屬性值是圖片的真真實位址。同樣最好給圖片設定寬度和高度，或者在 CSS 中設定也可以，否則似乎很底部很底部的圖片才會消極式載入。

　　3、JavaScript

Echo.init({offset: 0,throttle: 0}); 

參數

參數	說明
offset	離可視地區多少像素的圖片可以被載入
throttle	圖片延遲多少毫秒載入

以上內容是針對JavaScript映像消極式載入庫Echo.js ，希望對大家有所協助！

您可能感興趣的文章:

• 利用JS消極式載入百度分享代碼,提高網頁速度
• js圖片消極式載入的實現方法及思路
• 滑鼠划過實現消極式載入並隱藏層的js代碼
• 幾種消極式載入JS代碼的方法加快網頁的訪問速度
• jquery外掛程式lazyload.js消極式載入圖片的使用方法
• Jquery圖片消極式載入外掛程式jquery.lazyload.js的使用方法
• 淺析js預先載入/消極式載入