jQuery Lazy Load 图片延迟加载-技术博客集

jQuery Lazy Load 图片延迟加载
编程技术 / houtizong 发布于 3年前 109

版本：: jQuery v1.4.4+; jQuery Lazy Load v1.7.2
注意事项：: 需要真正实现图片延迟加载，必须将真实图片地址写在 data-original 属性中。若 src 与 data-original 相同，则只是一个特效而已，并不达到延迟加载的功能。

上一篇：看懂它，你就可以任性的玩耍了！

下一篇：JQuery中$.ajax()方法参数详解

请勿发布不友善或者负能量的内容。与人为善，比聪明更重要！

<div  >  <p style="color: #333333; font-family: Arial; line-height: 26px;">基于 jQuery 的图片延迟加载插件，在用户滚动页面到图片之后才进行加载。</p>  <p style="color: #333333; font-family: Arial; line-height: 26px;">对于有较多的图片的网页，使用图片延迟加载，能有效的提高页面加载速度。</p>  <dt>   <strong>版本</strong>： </dt>  <dd>  jQuery v1.4.4+ </dd>  <dd>  jQuery Lazy Load v1.7.2 </dd>  <dt>   <strong>注意事项</strong>： </dt>  <dd>   <p>需要真正实现图片延迟加载，必须将真实图片地址写在 data-original 属性中。若 src 与 data-original 相同，则只是一个特效而已，并不达到延迟加载的功能。</p>  </dd>  <p style="color: #333333; font-family: Arial; line-height: 26px;"><span style="font-size: 18px;"><strong>使用方法</strong></span>：</p>  <p style="color: #333333; font-family: Arial; line-height: 26px;">&nbsp;</p>  <h3 style="margin-bottom: 0px; color: #333333; font-family: Arial; line-height: 26px;"> <a style="color: #336699;" name="t0"></a>载入 JavaScript 文件</h3>  <div class="dp-highlighter bg_html" style="font-family: Consolas, 'Courier New', Courier, mono, serif; font-size: 12px; width: 700.90625px; overflow: auto; padding-top: 1px; color: #333333; line-height: 26px; margin: 18px 0px !important; background-color: #e7e5dc;">   <div class="bar" style="padding-left: 45px;">    <div class="tools" style="padding: 3px 8px 10px 10px; font-size: 9px; line-height: normal; font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; color: silver; border-left-width: 3px; border-left-style: solid; border-left-color: #6ce26c; background-color: #f8f8f8;">     <strong>[html]</strong>&nbsp;    <a href="http://blog.csdn.net/yongxiaokang1/article/details/42913935" title="view plain" class="ViewSource" style="">view plain</a>    <a href="http://blog.csdn.net/yongxiaokang1/article/details/42913935" title="copy" class="CopyToClipboard" style="">copy</a>     <div style="width: 18px; height: 18px;">     &nbsp;    </div>

留言需要登陆哦

技术博客集 - 网站简介：
前后端技术：
后端基于Hyperf2.1框架开发,前端使用Bootstrap可视化布局系统生成
网站主要作用：
1.编程技术分享及讨论交流，内置聊天系统;
2.测试交流框架问题，比如：Hyperf、Laravel、TP、beego;
3.本站数据是基于大数据采集等爬虫技术为基础助力分享知识，如有侵权请发邮件到站长邮箱，站长会尽快处理;
4.站长邮箱：[email protected];

文章归档

文章标签

友情链接

首页
关于我们

Auther ·HouTiZong: 侯体宗的博客