lazyload
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
<body>
<img data-original="images/001.jpg" src="js/grey.gif"
height="1077" border="0" />
<br />
<br />
<img data-original="images/002.jpg" src="js/grey.gif"
height="1077" border="0" />
<br />
<br />
<img data-original="images/003.jpg" src="js/grey.gif"
height="1077" border="0" />
<br />
<br />
<img data-original="images/004.jpg" src="js/grey.gif"
height="1077" border="0" />
<br />
<br />
<img data-original="images/005.jpg" src="js/grey.gif"
height="1077" border="0" />
<br />
<br />
<img data-original="images/006.jpg" src="js/grey.gif"
height="1077" border="0" />
<br />
<br />
<img data-original="images/007.jpg" src="js/grey.gif"
height="1077" border="0" />
<br />
<br />
<img data-original="images/008.jpg" src="js/grey.gif"
height="1077" border="0" />
<br />
<br />
<img data-original="images/009.jpg" src="js/grey.gif"
height="1077" border="0" />
<br />
<br />
<script src="js/jquery-1.7.js" type="text/javascript"
charset="utf-8"></script>
<script src="js/jquery.lazyload.js" type="text/javascript"
charset="utf-8"></script>
<script type="text/javascript" charset="utf-8">
$(function() {
$("img").lazyload({
effect : "fadeIn"
});
});
</script>
</body>
</body> </html>
lazyload的更多相关文章
- TypeScript为Zepto编写LazyLoad插件
平时项目中使用的全部是jQuery框架,但是对于做webapp来说jQuery太过于庞大,当然你可以选择jQuery 2.*针对移动端的版本. 这里我采用移动端使用率比较多的zepto框架,他跟jqu ...
- 图片的赖加载(lazyLoad)
懒加载的意义(在线demo预览) 尽管很多公司的网页都有一些限制,比如页面的最大的图片大小不得大于50k,也有很多图片优化工具fis3.gulp等等,但是如果图片太多还是会影响页面的加载速度,快则几十 ...
- 延迟加载外部js文件，延迟加载图片（jquery.lazyload.js和echo,js）
js里一说到延迟加载,大都离不开两种情形,即外部Js文件的延迟加载,以及网页图片的延迟加载: 1.首先简单说一下js文件的3种延迟加载方式: (1)<script type="text ...
- 图片懒加载jquery lazyload
<script type="text/javascript" src="jquery-1.11.3.min.js"></script>& ...
- 懒加载插件- jquery.lazyload.js
Lazy Load 是一个用 JavaScript 编写的 jQuery 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动到它们所在的位置. 这与图片预 ...
- 前端实现图片懒加载(lazyload)的两种方式
在实际的项目开发中,我们通常会遇见这样的场景:一个页面有很多图片,而首屏出现的图片大概就一两张,那么我们还要一次性把所有图片都加载出来吗?显然这是愚蠢的,不仅影响页面渲染速度,还浪费带宽.这也就是们通 ...
- jquery lazyload延迟加载技术的实现原理分析
懒加载技术(简称lazyload)并不是新技术,它是js程序员对网页性能优化的一种方案.lazyload的核心是按需加载.在大型网站中都有lazyload的身影,例如谷歌的图片搜索页,迅雷首页,淘宝网 ...
- 向上滚动或者向下滚动分页异步加载数据(Ajax + lazyload)[上拉加载组件]
/**** desc : 分页异步获取列表数据,页面向上滚动时候加载前面页码,向下滚动时加载后面页码 ajaxdata_url ajax异步的URL 如data.php page_val_name a ...
- jQuery.lazyload
Lazy Load延迟加载也有的称为惰性加载,是一个用 JavaScript 编写的 jQuery 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动到它 ...
- 懒加载lazyload
什么是懒加载 懒加载就是当你做滚动到页面某个位置,然后再显示当前位置的图片,这样做可以减少页面请求. 懒加载:主要目的是作为服务器前端的优化,减少请求数或延迟请求数,一些图片非常多的网站中非常有用,在 ...
随机推荐
- ACM3 求最值
/*2*2014.11.18*求最值*描述:给定N个整数(1<=N<=100),求出这N个数中的最大值,最小值.*输入:多组数据,第一行为一个整数N,第二行为N个不超过100的正整数,用空 ...
- nyoj 44 子串和 简单动态规划
子串和 时间限制:5000 ms | 内存限制:65535 KB 难度:3 描述 给定一整型数列{a1,a2...,an},找出连续非空子串{ax,ax+1,...,ay},使得该子序列的和最 ...
- 【转】Eclipse里项目名有红叉，但是展开后里面又没有红叉叉
Eclipse里项目名有红叉,但是下面的每一个文件都没有红叉 有三种可能: 1:classpath有问题 2:编译级别有问题 3:jar包有问题,我碰过从maven上获取了问题jar包,工程里提示能找 ...
- cf.301.D. Bad Luck Island(dp + probabilities)
D. Bad Luck Island time limit per test 2 seconds memory limit per test 256 megabytes input standard ...
- zstu.2512. Moving Tables(贪心）
Moving Tables Time Limit: 1 Sec Memory Limit: 64 MB Submit: 1182 Solved: 563 Description The famo ...
- iOS resign code with App Store profile and post to AppStore
http://stackoverflow.com/questions/17545452/ios-resign-code-with-app-store-profile-and-post-to-appst ...
- 关于css3的动画总结
旋转:transform:rotate(xxdeg)扭曲:transform:skey(x,y)缩放:transform:scale(x,y)变形位移:transform:translate(x,y) ...
- redis.1--SDS结构
1. Redis 没有直接使用c语言的字符串(以空字符结尾的字符数组),而是自己构建了一 种名为简单动态字符串(Simple Dynamic String , SDS),并将SDS做为 ...
- laravel中间件-----------middleware
middleware中间件 是访问到达服务器后在被对应的路由处理之前所经过的一层过滤层,故称中间件. 中间件是存放在app\http\middleware中,需要定一个 handle 处理方法,在ha ...
- linux 学习之路
很多同学接触Linux不多,对Linux平台的开发更是一无所知. 而现在的趋势越来越表明,作为一个优秀的软件开发人员,或计算机IT行业从业人员, 掌握Linux是一种很重要的谋生资源与手段. 下来我将 ...