Lozad.js 简单使用

GayHub位置:https://github.com/ApoorvSaxena/lozad.js

导入:

<script type="text/javascript" src="http://www.trancemelody.cn/bigi/js/lozad-v1.4.0.js"></script>

简单使用方式:

In HTML, add an identifier to the element (default selector identified is lozad class):
<img id="all" class="lozad" data-src="http://www.trancemelody.cn/bigi/images/enjoy/enjoy_v01-01_1_1.jpg" />

All you need to do now is just instantiate Lozad as follows:
const observer = lozad(); // lazy loads elements with default selector as '.lozad'
observer.observe();

更新图片简单方式:

$("#all").attr("data-src","http://www.trancemelody.cn/bigi/images/enjoy/enjoy_v01-01_1_2.jpg");
$("#all").attr("data-loaded","false");
observer.observe();

The "data-loaded"="true" attribute is used by lozad to determine if an element has been previously loaded.

猜你喜欢

转载自www.cnblogs.com/LiuPan2016/p/9062200.html
今日推荐