第一:加入jquery

第二:加入jquery.lazy.load.js文件

第三:在网页中加<script>

$(document).ready(function(){

$("img").lazyload();

});

</script>

第四:图片方式<img
src="预览图" data-original="真实路径"  width=""

height=""
/>

预防浏览器不支持JS应这样写:

<img src="预览图" data-original="真实路径" 
width="" height="" />

<noscript><img src=""真实路径
/></noscript>

附加:

可在lazyload({})
加入事件:
默认事件是:event:"scroll"
如:$("img").lazyload({event : "click",
effect:"fadeIn"});
$("img").lazyload({event : "scroll",
effect:"fadeIn"});

$("img").lazyload({event :
"scroll"});
详情看官网:

http://www.appelsiini.net/projects/lazyload

jquery 缓冲加载图片插件 jquery.lazyload的更多相关文章

  1. JQuery缓冲加载图片插件lazyload.js的使用方法

    lazyload.js是一个基于JQuery的插件,可以用来缓冲加载图片.如果一个网页很长并且有很多图片的话,下载图片就需要很多时间,那么就会影响整个网页的加载速度,而这款延迟加载插件,会通过你的滚动 ...

  2. 缓冲加载图片的 jQuery 插件 lazyload.js 使用方法详解

    在写代码的时候,经常会用到懒加载的模式,以前是通过window.onload的模式去加载,但是图片很多或者用ajax请求的时候,就会很麻烦,现在用lazyload的模式加载方便很多 <!doct ...

  3. jQuery顺序加载图片(终版)

    这一篇是对上一篇(jQuery顺序加载图片(初版)--http://www.cnblogs.com/newbie-cc/p/3707504.html)的改进. function loadImage(i ...

  4. jQuery顺序加载图片(初版)

    浏览器加载图片区别: IE:同时加载与渲染 其他:加载完之后再渲染 根据这个差异用jQuery做个实例:按顺序加载一组图片,加载完成后提示. <!DOCTYPE html> <htm ...

  5. jquery更改加载图片大小

    <script type="text/javascript"> $("img").css("width","80%&q ...

  6. jQuery懒加载插件 – jquery.lazyload.js简单调用

    Lazy Load 是一个用 JavaScript 编写的 jQuery 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动到它们所在的位置. 这与图片预 ...

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

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

  8. jQuery懒加载插件 – jquery.lazyload.js

    Lazy Load 是一个用 JavaScript 编写的 jQuery 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动到它们所在的位置. 这与图片预 ...

  9. jquery懒加载jquery.lazyload.js

    Lazy Load 是一个用 JavaScript 编写的 jQuery 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动到它们所在的位置. 这与图片预 ...

随机推荐

  1. jekyll bootstrap更改主题theme

    使用主题 介绍: 由于JB版本号0.2.X的主题,如今全然是模块化的.他们跟踪和单独版本号的主题包. 这让每一个人都能够自由公布和共享主题. Jekyll-Bootstrap v 0.2.x仅仅附带t ...

  2. sharepoint 2013 更改搜索server组态

    1.新搜索server在.安装sharepoint server 2013,并连接到一个现有的sharepoint server领域,完成后.您可以配置新的搜索server. 打开sharepoint ...

  3. Linux内核分析:页回收导致的cpu load瞬间飙高的问题分析与思考--------------蘑菇街技术博客

    http://mogu.io/156-156 摘要 本文一是为了讨论在Linux系统出现问题时我们能够借助哪些工具去协助分析,二是讨论出现问题时大致的可能点以及思路,三是希望能给应用层开发团队介绍一些 ...

  4. careercup-递归和动态规划 9.4

    9.4 编写一个方法,返回某集合的所有子集. 类似leetcode:Subsets 解法: 解决这个问题之前,我们先要对时间和空间复杂度有个合理的评估.一个集合会有多少子集?我们可以这么计算,生成了一 ...

  5. Servlet中的请求包含

    public class SrcIncludeServlet extends HttpServlet { public void doGet(HttpServletRequest request, H ...

  6. Java基础知识强化之IO流笔记44:IO流练习之 复制图片的 4 种方式案例

    1. 复制图片的 4 种方式案例: 分析: 复制数据,如果我们知道用记事本打开并能够读懂,就用字符流,否则用字节流. 通过该原理,我们知道我们应该采用字节流. 而字节流有4种方式,所以做这个题目我们有 ...

  7. zepto的scrollTo,实现锚点跳转

    实现功能:点击右侧字母A,实现锚点跳转功能: 有同学可能说可以直接用锚点跳转实现,是的,锚点跳转可以实现这个功能,但是有一个问题,点击跳转后,再点击返回,返回的是上次跳转的结果,具体的原理就不用多说了 ...

  8. Linux SSh scp使用【远程文件/目录的传输】

    一:Linux ssh scp的简介及作用: scp就是secure copy的简写,用于在linux下进行远程拷贝文件的命令,和它类似的命令有cp,不过cp只是在本机进行拷贝不能跨服务器. 有时我们 ...

  9. (转)CSS行高——line-height

    原文地址:http://www.cnblogs.com/dolphinX/p/3236686.html 初入前端的时候觉得CSS知道display.position.float就可以在布局上游刃有余了 ...

  10. 读《编写高质量代码:改善JavaScript程序的188个建议》1

    建议3:减少全局变量污染 定义全局变量有3种方式: ❑在任何函数外面直接执行var语句. var f='value'; ❑直接添加一个属性到全局对象上.全局对象是所有全局变量的容器.在Web浏览器中, ...