| 注册
请输入搜索内容

热门搜索

Java Linux MySQL PHP JavaScript Hibernate jQuery Nginx
jopen
9年前发布

图片脚本懒加载 - Lazyload

一个轻巧的小程序 - 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;

项目主页:http://www.open-open.com/lib/view/home/1447741261759

 本文由用户 jopen 自行上传分享,仅供网友学习交流。所有权归原作者,若您的权利被侵害,请联系管理员。
 转载本站原创文章,请注明出处,并保留原始链接、图片水印。
 本站是一个以用户分享为主的开源技术平台,欢迎各类分享!
 本文地址:https://www.open-open.com/lib/view/open1447741261759.html
Lazyload 图片展示jQuery插件 jQuery插件