当一个页面打开的图片太多,我们可以用jquery的一个延迟加载插件.名为:jquery.lazyload.min.js

使用非常简单,如下:

   <div  style="height:700px;">
<img src="img/grey.gif" data-original="http://www.ziyou.com.cn/ziyou/uploadImg/bberfq.jpg" width="765" height="574" alt="BMW M1 Hood"><br/>
</div>
<div>
<img src="img/grey.gif" data-original="http://www.ziyou.com.cn/ziyou/uploadImg/cvbcvb.jpg" width="765" height="574" alt="BMW M1 Hood"><br/>
</div> <div>
<img src="img/grey.gif" data-original="http://www.ziyou.com.cn/ziyou/uploadImg/1322450338410.jpg" width="765" height="574" alt="BMW M1 Hood"><br/>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" src="/index/@py-z_class/jquery.lazyload.min.js"></script>
<script type="text/javascript" charset="utf-8">
$(function() {
$("img").lazyload();
});
</script>

对性能提升非常有帮助

图片延迟插件 Jquery.lazyload.min.js的更多相关文章

  1. jQuery图片延迟加载插件jQuery.lazyload

      插件描述:jQuery图片延迟加载插件jQuery.lazyload,使用延迟加载在可提高网页下载速度.在某些情况下,它也能帮助减轻服务器负载. 使用方法 引用jquery和jquery.lazy ...

  2. Bootstrap导航点击菜单跳转与点击缩放菜单折叠按钮缓冲效果插件jquery.singlePageNav.min.js

    引入步骤: <script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></scrip ...

  3. 异步提交表单插件jquery.form.min.js的使用实例

    因为项目中需要达到效果:前台点击按钮弹出文件选择框,选择文件确定之后,上传到后台对文件进行处理并给出响应信息. 尝试过使用$.post,$.ajsx,将表单序列化之后传到后台,但是后台并不能收到文件, ...

  4. jQuery图片延迟加载插件jquery.lazyload.js

    在实际的项目开发中,我们通常会遇见这样的场景:一个页面有很多图片,而首屏出现的图片大概就一两张,那么我们还要一次性把所有图片都加载出来吗?显然这是愚蠢的,不仅影响页面渲染速度,还浪费带宽.这也就是们通 ...

  5. 图片延迟加载插件jquery.lazyload.js的使用方法

    最新版的jquery.lazyload.js已不再是伪的延迟加载了 一.请按照基本使用方法说明设置 //载入JavaScript 文件 <script src="jquery.js&q ...

  6. jQuery图片延迟加载插件jQuery.lazyload使用方法(转)

    使用方法 1.引用jquery和jquery.lazyload.js到你的页面 <script src="jquery-1.11.0.min.js"></scri ...

  7. jQuery图片延迟加载插件jQuery.lazyload 的使用

    使用方法 引用jquery和jquery.lazyload.js到你的页面 1 2 <script src="jquery-1.11.0.min.js"></sc ...

  8. jquery.imgpreload.min.js插件实现页面图片预加载

    页面分享地址: http://wenku.baidu.com/link?url=_-G8miwbgDmEj6miyFtjit1duJggBCJmFjR2jky_G1VftD9eS9kwGOlFWAOR ...

  9. jQuery懒加载插件jquery.lazyload.js使用说明实例

    jQuery懒加载插件jquery.lazyload.js使用说明实例很多网站都会用到‘图片懒加载’这种方式对网站进行优化,即延迟加载图片或符合某些条件才开始加载图片.懒加载原理:浏览器会自动对页面中 ...

随机推荐

  1. kuangbin专题十六 KMP&&扩展KMP HDU4300 Clairewd’s message

    Clairewd is a member of FBI. After several years concealing in BUPT, she intercepted some important ...

  2. 4. mybatis 的排序

    order by(排序) 的用法 根据哪一个列进行排序   配置文件 mapper.xml 如果是一个列的话就用${value} <select id="selectBlogOrder ...

  3. Hibernate常见报错

    1.A different object with the same identifier value was already associated with the session(使用Hibern ...

  4. php 安装扩展库

    liunx系统 1. /usr/local/php/bin/php-config php 配置文件位置 [ php-config是一个脚本文件,用于获取所安装的php配置的信息 ] 在编译扩展时,如果 ...

  5. PHP的魔术常量

    PHP的魔术常量(变量).魔术方法(函数).超全局变量 一.魔术常量(魔术变量) 概念:所谓的魔术常量就是PHP预定义的一些常量,这些常量会随着所在的位置而变化. 1.__LINE__  获取文件中的 ...

  6. dedecms中模板函数

    下面来解说下DEDECMS织梦CMS模板里面的函数说明 在文件include/inc_function.php里面 1 2 GetCurUrl() 获贴切前的脚本的URL 1 2 GetAlabNum ...

  7. centos7博客的基础搭建(LNMP)

    linux [root@zbb wordpress]# cat /etc/redhat-release CentOS Linux release 7.4.1708 (Core) nginx echo ...

  8. 【Effective Java】阅读

    Java写了很多年,很惭愧,直到最近才读了这本经典之作<Effective Java>,按自己的理解总结下,有些可能还不够深刻 一.Creating and Destroying Obje ...

  9. HIVE 计算指定日期本周的第一天和最后一天

    -- 计算指定日期本周的第一天和最后一天 select day ,dayofweek(day) as dw1 ,date_add( - dayofweek(day)) as Su_s -- 周日_st ...

  10. form表单序列化数据之后,追加额外数据

    form表单序列化数据之后追加额外数据多使用在js中,下面是追加额外数据的代码: <span style="font-size:18px;">$.param({'inv ...