CDN:<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/lozad/dist/lozad.js"></script>
用法:
在html中,给需要懒加载的元素加上lozad
的类名,并将src改为data-src,如下所示:
图片img标签:
<img class='lozad' data-src='image.png' />
图片背景图:
<div class='lozad' data-background-image='image.png'>
</div>
最后实例化:
const observer = lozad();
observer.observe();
或
const observer = lozad('.lozad',{
rootMargin: '10px 0px',
threshold: 0.1
});
observer.observe();
github:https://github.com/ApoorvSaxena/lozad.js
缺点:兼容性不好