jquery.lazyload 使用
1、引用js
<script src="jquery.js" type="text/javascript"></script>
<script src="jquery.lazyload.js" type="text/javascript"></script>
2、需要加载的图片写成以下的形式:
<img class="lazy" data-original="img/example.jpg" width="640" height="480">
或者: <img class="lazy" data-original="img/example.jpg" src="/Content/images/home/nopic_shop.png" width="640" height="480"> 最下面的是有默认图的。建议用下面的
3、在要加载的页面,加上js
$(function() {
$("img.lazy").lazyload();
});
我一般使用下面有效果的模式:
//加载图片
$("img.lazy").lazyload({
effect: "fadeIn"
});
更多需求文档,请参考官方的介绍:
http://www.appelsiini.net/projects/lazyload
jquery.lazyload 使用的更多相关文章
- 延迟加载外部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.lazyload使用及源码分析
前言: 貌似以前自己也写过图片懒加载插件,但是新公司使用的是jQuery.lazyload插件,为了更好的运用,自己还是把源码看了遍,分别记录了如何使用, 插件原理,各个配置属性的完整解释,demo实 ...
- jQuery.lazyload详解
<SCRIPT src="jquery.js" type=text/javascript></SCRIPT> <SCRIPT src="jq ...
- jQuery延迟加载(懒加载)插件 – jquery.lazyload.js
引入:<script type="text/javascript" src="${base}/resources/shop/js/jquery.lazyload.j ...
随机推荐
- tcp连接的状态变迁以及如何调整tcp连接中处于time_wait的时间
一.状态变迁图 二.time_wait状态 针对time_wait和close_wait有个简单的描述帮助理解: Due to the way TCP/IP works, connections ca ...
- 调用TerminateProcess是无法触发DLL_PROCESS_DETACH的
当应用程序中调用TerminateProcess函数,对于在DllMain函数中处理DLL_PROCESS_DETACH的额外代码操作是无法被执行的.比如:释放资源.数据持久化等.
- 【咸鱼教程】Egret可长按识别二维码(精确位置和大小)
教程目录一 实现原理二 实现过程三 Demo下载 本教程是在Egret中实现长按识别的二维码,并可以精确定位二维码的位置和大小,支持横屏和竖屏. 一 实现原理 微信中长按识别二维码,需要长按jpg或p ...
- R的any和all
> x<-1:10 > any(x>8) [1] TRUE > all(x>8) [1] FALSE
- Save vtkMatrix4x4 to a file 保存到文件
vtkMatrix4x4是VTK中的一个表示4x4矩阵的一种数据结构,有时候我们想把其保存到一个文件中,那么可以使用如下的代码: void writeVtkMatrix4x4ToFile(const ...
- nginx 开机自动启动
接下来聊一聊nginx的开机自启吧 看了看都是用脚本启动的,我也就不扯啥犊子了,都是前人经验 我的操作系统是centos 7 nginx版本是1.10.3 首先看一下自己的nginx配置 我的是 ./ ...
- poj2752seek the name, seek the fame【kmp】
The little cat is so famous, that many couples tramp over hill and dale to Byteland, and asked the l ...
- ubuntu16.04下安装artoolkit5
目前对AR技术的常见理解就是CV(Computer Vision)+CG(Computer Graphic).CV的方法很多,简单些比如FREAK+ICP(ARToolKit中的NFT),复杂些就是S ...
- 一次使用Python连接数据库生成二维码并安装为windows服务的工作任务
最近有一个需求,在现有生产系统上的人员库中增加一个此人员关键信息的二维码,支持文字版和跳转版两种方式,与报表工具关联,可打印.以windows服务方式,定时检查,只要发现某人员没有此二维码信息,就生成 ...
- 用栈来递归 模板 honoi
用栈来模拟递归的技巧 #define _CRT_SECURE_NO_WARNINGS #include<iostream> #include<vector> #include& ...