jquery.lazyload.js图片延迟加载
转:http://www.jb51.net/article/50273.htm
新版的jquery.lazyload.js已不再是伪的延迟加载了
一、请按照基本使用方法说明设置
<script
src="jquery.js" type="text/javascript"></script>
<script
src="jquery.lazyload.js" type="text/javascript"></script>
<img class="lazy"
data-original="img/example.jpg" width="640" height="480">
$(function() {
$("img.lazy").lazyload();
});
二、常用属性说明
//设置灵敏度,表示进入显示区域还有200像素就开始加载
effect : "fadeIn" //使用淡入特效
failure_limit : 10
//容差范围,一定要设置此值,原因说明请参考原文档
container: $("#container") //使用父容器,父容器的CSS样式至少应包含"height: 600px;overflow:
scroll;"两个属性
event : "click" //修改触发事件为单击
三、参考
英文参考:http://www.appelsiini.net/projects/lazyload
中文参考:http://code.ciaoca.com/jquery/lazyload/
Jquery 图片延迟加载
http://jingyan.baidu.com/article/fec7a1e5199a411191b4e74a.html
jquery.lazyload.js图片延迟加载的更多相关文章
- jquery.lazyload.js图片延迟加载(懒加载)--转载
一.插件介绍 jquery.lazyload.js 是一个用 JavaScript 编写的jQuery 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动 ...
- jquery.lazyload.js 图片延迟加载
当做网页的时候,特别是整个网页展示图片较多的时候,用到图片延迟效果是很好的 使用方法也非常简单. 1.在网页任何位置(一般是在</body>前面)加上如下代码(注意<script&g ...
- jquery.lazyload 实现图片延迟加载jquery插件
看到了淘宝产品介绍中,图片是在下拉滚动条时加载,这是一个很不错的用户体验.减少了页面加载的时间了,也减轻了服务器的压力,就查了下用JQuery.. 什么是ImageLazyLoad技术 在页面上图 ...
- JQuery LazyLoad实现图片延迟加载-探究
对于大量图片的网站,图片延迟加载是提高速度和性能的好方法. 目前图片延迟加载主要分两大块,一是触发加载(根据滚动条位置加载图片):二是自动预加载(加载完首屏后n秒后自动加载其他位置的图片).大体常用的 ...
- 一个简单而实用的JQ插件——lazyload.js图片延迟加载插件
前 言 Cherish 看多了炫酷的插件之后再来看这么一个小清新的东西,是不是突然感觉JQ插件感觉很友好了,简单强大最重要的是实用. 这篇文章将详细讲解一下lazyload.js的用法 lazy ...
- 使用jQuery lazyload 实现图片延迟加载
下载地址 使用说明 0. 准备工作 下载jQuery和lazyload 插件(地址如上) 1. HTML 引入jQuery库和lazyload插件 <div id="imagesCon ...
- 使用jquery插件实现图片延迟加载技术(懒加载)
有时我们看到一些大型网站,页面如果有很多图片的时候,当你滚动到相应的行时,当前行的图片才即时加载的,这样子的话页面在打开只加可视区域的图片,而其它隐藏的图片则不加载,一定程序上加快了页面加载的速度,对 ...
- 延迟加载外部js文件,延迟加载图片(jquery.lazyload.js和echo,js)
js里一说到延迟加载,大都离不开两种情形,即外部Js文件的延迟加载,以及网页图片的延迟加载: 1.首先简单说一下js文件的3种延迟加载方式: (1)<script type="text ...
- jQuery图片延迟加载插件jquery.lazyload.js
在实际的项目开发中,我们通常会遇见这样的场景:一个页面有很多图片,而首屏出现的图片大概就一两张,那么我们还要一次性把所有图片都加载出来吗?显然这是愚蠢的,不仅影响页面渲染速度,还浪费带宽.这也就是们通 ...
随机推荐
- Matlab编程-数值计算相关语法
1.变量的命名规则(类似C语言): (1) 区分大小写 (2) 变量长度不超过31位 (3) 变量名以字母开头,变量名中包含字母.数字.下划线,不可以用标点 2. Mathlab预定 ...
- DocumentBuilder setEntityResolver() Method
Description The Javax.xml.parsers.DocumentBuilder.setEntityResolver(EntityResolver er) method specif ...
- java_method_readFile读取文件文本xls
package cn.com.qmhd.tools; import java.io.FileInputStream; import java.io.FileNotFoundException; imp ...
- 规则引擎QLExpress的简单应用
QLExpress 是一个轻量级的类java语法规则引擎,作为一个嵌入式规则引擎在业务系统中使用.让业务规则定义简便而不失灵活.让业务人员就可以定义业务规则.支持标 准的JAVA语法,还可以支持自定义 ...
- jQuery 实现上下,左右滑动
前几天的任务:http://t.sina.com.cn/ 的下滑效果. 渐变移动出足够的空白 -> 淡出最后一个 ->渐变移动出足够的空白 我们要做的是向左移动效果.这个效果用时需添加一 ...
- Memo打印
加入Printers单元, ; Left ; y ;; do begin Printer.Canvas.TextOut(x,y,Memo1.Lines[i]) ...
- Android 图标上面添加提醒(一)使用Canvas绘制
版权声明:本文为博主原创文章,未经博主允许不得转载. 在我们开发一些如通讯录.社交等应用或者应用添加新功能模块时,会考虑在对应的图标上加上未读信息的数量,或者是新功能提醒的图标,这样不占太大空间还能达 ...
- MyEclipse8.6安装svn(非link方式)
此方法经试验可行,暂时可以作为最佳解决方案. 本文所使用的MyEclipse版本为:8.6.1 svn的eclipse插件版本为:1.6.17,下载地址:http://subclipse.tigris ...
- [转] JavaScript中的属性:如何遍历属性
在JavaScript中,遍历一个对象的属性往往没有在其他语言中遍历一个哈希(有些语言称为字典)的键那么简单.这主要有两个方面的原因:一个是,JavaScript中的对象通常都处在某个原型链中,它会从 ...
- PhalGo-介绍
PhalGo-介绍 phalgo是一个Go语言的一体化开发框架,主要用于API开发应为使用ECHO框架作为http服务web程序一样可以使用,牛顿曾经说过"如果我比别人看得远,那是因为我站在 ...