JavaScript图像延迟加载库Echo.js
Echo是一个独立的JavaScript懒加载图像的工具,快速、体积小(不足1k)和使用HTML5的data-属性。Echo支持IE8+。
插件描述:和LazyLoad一样,Echo.js也是一个用于图像延迟加载JavaScript。不同的是LazyLoad是基于jQuery的插件,而Echo.js不依赖于jQuery或其他JavaScript库,可独立使用。并且Echo.js非常小巧,压缩后不足1KB。
兼容性
Echo.js使用了HTML5的date属性,并且需要获取该属性的值,所以它并不兼容IE6、IE7。虽然LazyLoad也使用了HTML5的date属性,但它获取值的方法不一样。
使用方法
1、引入文件
<scriptsrc="js/echo.min.js"></script>
2、HTML
<imgsrc="images/blank.gif"alt="pic"data-echo="img/pic.jpg"width="640"height="480">
blank.gif是一个1x1的图片,用做默认图片,data-echo的属性值是图片的真实地址。同样最好给图片设置宽度和高度,或者在CSS中设置也可以,否则似乎很底部很底部的图片才会延迟加载。
3、JavaScript
Echo.init({ offset:0, throttle:0 });
参数
说明
offset
离可视区域多少像素的图片可以被加载
throttle
图片延迟多少毫秒加载
以上内容是针对JavaScript图像延迟加载库Echo.js,希望对大家有所帮助!