欢迎来到258分享网,纯净的网络源码分享基地!

258资源分享网

全部作品
全部作品
网站源码
微信源码
素材特效
源码插件
视频教程
建站学院
热门搜索: 织梦  农业种植  农业  安全设置  官方
258资源分享 > 建站学院 > 织梦教程 > 织梦网站如何用jQuery.lazyload延时加载图片

推荐下载

HTML5响应式自适应网咯设计

2020-05-12   浏览:789

HTML5自适应律师工作室类网

2020-04-04   浏览:654

高端HTML5响应式企业通用网

2020-05-06   浏览:560

html5响应式外贸网站英文版

2020-05-08   浏览:545

HTML5影视传媒文化公司类网

2020-05-12   浏览:543

织梦网站如何用jQuery.lazyload延时加载图片

发布时间:2020-06-27  

第一步:在网站头部引用lazyload,可以把lazyload文件下载下来也可以直接在各大公共库中引用

<script src=http://www.dede58.com/a/dedejq/"http:/apps.bdimg.com/libs/jquery-lazyload/1.9.5/jquery.lazyload.js" type="text/javascript"></script>

注意:不可以放在底部哦,一定要放在站内需要延时加载图片的上方。

第二步:在网站所有图片中指定要延时加载的图片,这里以织梦系统的网站为例:

<img data-original="[field:first_imgurl/]" src=http://www.dede58.com/a/dedejq/"[field:litpic/]"/>

说明:上面就是把图片指定到lazy样式中,“data-original”一定要是网站真实要显示的图片地址。

第三步:在网站底部加入以下代码,恰恰和第一步相反:  

<script type="text/javascript"> $("img.lazy").lazyload({ effect : "fadeIn" }); </script>