如何处理jquery加载插件时出现的懒加载

如题所述

懒加载是网站性能优化的插件,可以提高用户体验。

页面如果有很多图片的时候,当你滚动到相应的行时,当前行的图片才即时加载的,这样子的话页面在打开只加可视区域的图片,而其它隐藏的图片则不加载。

1、引入jquery

<script type="text/javascript" src="http://libs.baidu.com/jquery/1.8.0/jquery.min.js" ></script>

2、引入jquery懒加载插件

<script type="text/javascript" src="//cdn.bootcss.com/jquery.lazyload/1.9.1/jquery.lazyload.min.js"
></script>

3、在需要懒加载的图片上添加如下:

<img class='lazy' src='../images/i.png' data-original='" + obj.picurl + "' width='600' height='300' >";

src显示默认的图片

data-original为要显示的图片

4、启动懒加载

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

一般放在ajax complete中加载
温馨提示:答案为网友推荐,仅供参考
第1个回答  2017-08-24
双击666快速处理
相似回答