自用图片懒加载,支持div background+img
网页图片懒加载js
可以等图片加载完成后再显示
使用说明 引入工具库<script src="https://lf6-cdn-tos.bytecdntp.com/cdn/jquery/3.6.0/jquery.min.js"></script>
<script src="https://fastly.jsdelivr.net/gh/chxin579/imagelazy@1.0/imglazyloding.js"></script>
图片加载演示
img加载
<div id="imglist">
<img style="width:500px;height:500px;" src="你的加载图像" data="https://wkphoto.cdn.bcebos.com/5fdf8db1cb134954d8596201464e9258d1094a14.jpg">
</div>
div背景加载
<div id="divlist">
<div class="imgdiv" style="width:500px;height:500px;background-image: 你的加载图像;" data="https://wkphoto.cdn.bcebos.com/5fdf8db1cb134954d8596201464e9258d1094a14.jpg">
</div>
插入到最后
<script>
errorimg="你的自定义错误图像,未设置将使用默认图像";
$("#divlist").ImgLoading();
$("#imglist").ImgLoading();
</script>
未来更新
1、自定义错误图像比例
2、更多需求请提出issue
版权声明:
1、该文章(资料)来源于互联网公开信息,我方只是对该内容做点评,所分享的下载地址为原作者公开地址。2、网站不提供资料下载,如需下载请到原作者页面进行下载。