微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

lazyload.js

编程之家收集整理的这个编程导航主要介绍了lazyload.js编程之家,现在分享给大家,也给大家做个参考。

lazyload.js 介绍

lazyload.js用于长页面图片的延迟加载,视口外的图片会在窗口滚动到它的位置时再进行加载,这是与预加载相反的。 

lazyload.js优点:

它可以提高页面加载速度;

在某些情况清晰它也可以帮助减少服务器负载

 

lazyload.js安装:

bower安装:

bower install jquery.lazyload

npm安装:

npm install jquery-lazyload

lazyload.js使用:

lazyload依赖与jquery。所以先引入jquery和lazyload

<script src="jquery.js"></script>

<script src="jquery.lazyload.js"></script>

1.将图片路径写入data-original属性

2.给lazyload的图片增加一个名为lazy的class

3.选择所有要lazyload的图片(img.lazy),执行lazyload();

<img class="lazy" data-original="img/example.jpg" margin-top:1000px" height="200">

<script>

$(function(){

$("img.lazy").lazyload();

})

</script>

网站地址:https://appelsiini.net/projects/lazyload

GitHub:https://github.com/tuupola/lazyload

网站描述:jquery图片懒加载插件

lazyload.js

官方网站:https://appelsiini.net/projects/lazyload

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。