jquery delayLoading.js插件的延迟加载效果和图片延迟加载
1、首页给大家介绍一下这款插件的主要用途
主要应用于图片的延迟加载,而且可以变换不同的延迟加载效果,适合相册图片。有做相册的可以考虑应用。
2、兼容IE7以上都兼容,其他的浏览器也兼容。所以说兼容性还是不错的。
3、插件的调用也是很简单的,看下面展示:
下面对调用属性的解释也都写在了代码中,可以参考换不同的风格。
<script type="text/javascript">
$(function () {
$("img").delayLoading({
defaultImg: "images/loading.jpg", // 预加载前显示的图片
errorImg: "", // 读取图片错误时替换图片(默认:与defaultImg一样)
imgSrcAttr: "originalSrc", // 记录图片路径的属性(默认:originalSrc,页面img的src属性也要替换为originalSrc)
beforehand: 0, // 预先提前多少像素加载图片(默认:0)
event: "scroll", // 触发加载图片事件(默认:scroll)
duration: "normal", // 三种预定淡出(入)速度之一的字符串("slow", "normal", or "fast")或表示动画时长的毫秒数值(如:1000),默认:"normal"
container: window, // 对象加载的位置容器(默认:window)
success: function (imgObj) { }, // 加载图片成功后的回调函数(默认:不执行任何操作)
error: function (imgObj) { } // 加载图片失败后的回调函数(默认:不执行任何操作)
});
});
</script>
下面我给大家留下演示地址及下载方式:
演示地址:http://www.landedo.com/plugs/details-179.html
jquery delayLoading.js插件的延迟加载效果和图片延迟加载的更多相关文章
- 整屏滚动效果 jquery.fullPage.js插件+CSS3实现
最近很流行整屏滚动的效果,无论是在PC端还是移动端,本人也借机学习了一下,主要通过jquery.funnPage.js插件+CSS3实现效果. 本人做的效果: PC端:http://demo.qpdi ...
- 购物车增加、减少商品时动画效果:jQuery.Fly.js插件使用方法
某些电商网站加入购物车和减少购物车商品数量时,有个小动画,以抛物线形式增减,如图: 这里用到了第三方jQuery.Fly.js插件(底层依赖Jquery库,地址:https://github ...
- 【PC端】jQuery+PHP实现浏览更多内容(jquery.more.js插件)
参数说明: 'amount' : '10', //每次显示记录数 'address' : 'comments.php', //请求后台的地址 'format' : 'json', //数据传输格式 ' ...
- jquery.autocomplete.js 插件的自定义搜索规则
这二天开始用jquery.autocomplete这个自动完成插件.功能基本比较强大,但自己在实际需求中发现还是有一处不足!问题是这样:当我定义了一个本地数据JS文件时,格式为JSON式的数组.如下: ...
- jQuery.cookie.js插件了解及使用方法
jquery.cookie.js插件实现浏览器的cookie存储,该插件是基于jquery开发,方便cookie使用. jquerycookie.js的下载地址 http://plugins.jque ...
- 异步上传图片,光用jquery不行,得用jquery.form.js插件
异步上传图片,光用jquery不行,得用jquery.form.js插件,百度一下下载这个插件,加jquery,引入就可以了 <form id="postbackground" ...
- ajax请求执行完成后再执行其他操作(jQuery.page.js插件使用为例)
就我们做知,ajax强大之处在于它的异步请求,但是有时候我们需要ajax执行彻底完成之后再执行其他函数或操作 这个时候往往我们用到ajax的回调函数,但是假如你不想或者不能把接下来的操作写在回调函数中 ...
- jquery.validate.js插件的使用方法
近期做项目.须要用到 jQuery.validate.js插件,于是记录一下工作中的一些经验,以便日后学习. [样例例如以下] 1.前台页面 <form id="form1" ...
- 使用jQuery的插件jquery.corner.js来实现圆角效果-详解
jquery.corner.js可以实现各种块级元素的角效果,以下为演示,详见jquery_corner.html中的注释部分,并附百度盘下载 jquery_corner.html代码如下: < ...
随机推荐
- 【NXP开发板应用—智能插排】1.如何使用scp传输文件
首先感谢深圳市米尔科技有限公司举办的这次活动并予以本人参加这次活动的机会,以往接触过嵌入式,但那都是皮毛,最多刷个系统之类的,可以说对于嵌入式系统开发这件事情是相当非常陌生的,这次活动为我提供了一个非 ...
- [转]Visual C++ 和 C++ 有什么区别?
注:本篇内容转载与网络,方便自己学习,如有侵权请您联系我删除,谢谢. 有位同学问我“Visual C++和C++有什么区别?”,这的确是初学者会感到困惑的问题,比较常见.除此之外,还有“先学C++好, ...
- 串口UART学习笔记(一)
买了一个开发板学习FPGA,找到的各种东西就记录在这个博客里了,同时也方便把自己不会的问题找到的结果记录一下,都是自己手打,所以可能说的话不那么严谨,不那么精准,看到的人要带着自己的思考去看,记住尽信 ...
- java基础之while语句的练习
计算1-100,7的倍数的数的总和 代码如下: public class Demo1 { public static void main(String[] args) { int num=1; int ...
- 20145234黄斐《信息安全系统设计基础》第六周学习总结(Y86模拟器的安装)
Y86模拟器的安装 由于本人的电脑有些问题,在安装的时候忽然断电导致之前的成果都没有截图. 1.安装bison和flex词法分析工具 sudo apt-get install bison flex t ...
- 厦门Uber优步司机奖励政策(1月11日~1月17日)
滴快车单单2.5倍,注册地址:http://www.udache.com/ 如何注册Uber司机(全国版最新最详细注册流程)/月入2万/不用抢单:http://www.cnblogs.com/mfry ...
- 每天看一片代码系列(一):stream.js
简介 stream.js是一个小型的js库,用于处理stream相关的操作.这里的stream是指一种数据结构,它像数组一样,可以放置多个类型的数据,但是并不限制长度,甚至可以达到无限长.可以对该数据 ...
- MyBatis-自定义结果映射规则
1.自定义结果集映射规则 ①查询 <!-- public Employee getEmpById(Integer id); --> <select id="getEmpBy ...
- json模块使用总结——Python
# 原创文章,未经允许请勿转载 通过Python的json模块,可以将字符串形式的json数据转化为字典,也可以将Python中的字典数据转化为字符串形式的json数据. 之前使用这个模块时,都是随用 ...
- 「日常训练&知识学习」树的直径(POJ-1849,Two)
题意 一个城市由节点和连接节点的街道组成,街道是双向的. 此刻大雪覆盖了这个城市,市长确定了一些街道要将它们清扫干净,这些街道保证所有的节点可以通过它们连通而且街道数目尽可能小. 现有两台相同的扫雪机 ...