jquery.lazyload用法
lazyload是jquery的插件,作为延迟加载图片,减压服务器压力。
如何使用:
先把
<script src="jquery.js" type="text/javascript"></script>
<script src="jquery.lazyload.min.js" type="text/javascript"></script>放在body里面
修改html里面的img src为占位符1*1像素灰色的gif代码如下:
<img src="img/grey.gif" data-original="img/bmw_m1_hood.jpg" />
基本处理图片代码如下
$(function(){
$("img[data-original]").lazyload();
})
提前加载图片代码
$("img.lazy").lazyload({ threshold : 6 });数字可以修改
事件触发代码:
事件可以是任何 jQuery 时间, 如: click
和 mouseover
. 你还可以使用自定义的事件, 如: sporty
和 foobar
. 默认情况下处于等待状态, 直到用户滚动到窗口上图片所在位置. 在灰色占位图片被点击之前阻止加载图片, 你可以这样做:
$("img").lazyload({
placeholder : "img/grey.gif",
event : "click"
});
淡出效果代码:
$("img.lazy").lazyload({
effect : "fadeIn"
});
加载隐藏的代码:特别是做选显卡的是总是要隐藏图片这个就要给设置为skip_invisible : false不然就加载不出来
$("img[data-original]").lazyload({skip_invisible : false});
参考英文网站:http://www.appelsiini.net/projects/lazyload
jquery.lazyload用法的更多相关文章
- jQuery之jquery.lazyload.js插件用法
研究背景:网站中如果图片过多,就会因为加载图片而等待很长时间,此时我们就用到图片延时加载插件jquery.lazyload.js,这个插件可以让我们在向下滚动的时候加载图片.让网页首屏尽可能快的加载进 ...
- 延迟加载外部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 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动到它们所在的位置. 这与图片预 ...
- jQuery.lazyload
Lazy Load延迟加载也有的称为惰性加载,是一个用 JavaScript 编写的 jQuery 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动到它 ...
- jquery.lazyload 实现图片延迟加载jquery插件
看到了淘宝产品介绍中,图片是在下拉滚动条时加载,这是一个很不错的用户体验.减少了页面加载的时间了,也减轻了服务器的压力,就查了下用JQuery.. 什么是ImageLazyLoad技术 在页面上图 ...
- jquery懒加载jquery.lazyload.js
Lazy Load 是一个用 JavaScript 编写的 jQuery 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动到它们所在的位置. 这与图片预 ...
- jQuery lazyload 懒加载
Lazy Load 是一个用 JavaScript 编写的 jQuery 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动到它们所在的位置. 这与图片预 ...
- jQuery $.each用法[转]
jQuery $.each用法 以下内容非原创,来自百度文库http://wenku.baidu.com/view/4796b6145f0e7cd18425368e.html 通过它,你可以遍历对象. ...
随机推荐
- P3382: [Usaco2004 Open]Cave Cows 3 洞穴里的牛之三
首先,我们先确定,最长的曼哈顿距离只可能为 x1+y2-(x2+y2) 和 x1-y1-(x2-y2) 所以我们只需要维护四个值, 分别代表 max(x+y) ; max(x-y) ; min(x+y ...
- cocos2dx中使用声音引擎需要包含的头文件
1.需要包含的头文件和命名空间 #include "SimpleAudioEngine.h"using namespace CocosDenshion;
- 使用Log Explorer查看和恢复数据
由于一次意外操作,把QC数据库中的BUG表数据给删掉了.崩溃-上网找了下恢复方法,找到一款Log Explorer.下载安装使用后,发现这款软件的确不错,收藏ing. 本次的使用的Log Expl ...
- Visual Studio 2012 [ADO.NET 实体数据模型]丢失没有的解决方法
首先打开控制面板,看是否已经安装EF,如果已经安装,先卸载,然后,首先打开安装包,找到/packages/EFTools目录下的EFTools.msi,将它们复制自己计算机的某一目录下,例如:C:\t ...
- OpenCms 集成外部Solr Server
OpenCms默认是以内嵌的Solr作为全文搜索服务的,不过我们也可以配置一个独立的Solr搜索服务器 设置外部Solr Server 1. 从Solr 官方站点http://lucene.apach ...
- poj 2987 Firing 最大权闭合图
题目链接:http://poj.org/problem?id=2987 You’ve finally got mad at “the world’s most stupid” employees of ...
- poj 1113 Wall
题目链接:http://poj.org/problem?id=1113 题目大意:给出点集和一个长度L,要求用最短长度的围墙把所有点集围住,并且围墙每一处距离所有点的距离最少为L,求围墙的长度. 解法 ...
- 【POJ】【1821】Fence
DP/单调队列优化 题意:k个人粉刷总长为n的墙壁(或者说栅栏?),每个人有一个必刷点s[i](这个人也可以一点也不刷,如果刷就必须刷这个点),最大粉刷长度l[i](必须是连续粉刷一段),和粉刷一格的 ...
- 超快的 FastText
Word2Vec 作者.脸书科学家 Mikolov 文本分类新作 fastText:方法简单,号称并不需要深度学习那样几小时或者几天的训练时间,在普通 CPU 上最快几十秒就可以训练模型,得到不错的结 ...
- ZOJ2929 Penalty Kick(概率)
题目挺水的,但由于其独特的阅读量比赛的时候没发现这道水题,在此做一下翻译,如果有人搜到这翻译的话有帮助的话自然最好啦. 中国队平局进入最后的点球决胜局,首先抛硬币决定谁先罚球,然后先是罚五球,如果罚的 ...