图片脚本懒加载 - Lazyload
jopen
8年前
一个轻巧的小程序 - Lazyload，100 行代码。加上一个data-src属性，能够让页面中的图片懒加载、textarea 中的脚本懒执行，有需要的可以拿过去用用，代码逻辑比较简单，也可以自己增强点功能，比如动态添加懒加载监听等等。
<script src="https://raw.githubusercontent.com/barretlee/lazyload/master/index.js"></script> <div class="box"> <div class="item"><img src data-src="img-path"></div> <div class="item"><textarea>alert(1)</textarea></div> </div>
It exports an api to global:
new Lazyload('.box .item');
Params
There are two param your can set:
- Lazyload.TAG, default is 'data-src', we set the lazyload image 'src' to null, then read 'data-src' attribute. for example:
<img src data-src="THE-REAL-PATH" />
- Lazyload.DISTANCE, default is 0, if you want to show the lazyload element in advance, you can set it to a positive number;