Jquery实现图片的预加载与延时加载
有很多项目经常会需要判断图片加载完成后执行相应的操作,或者需要图片延迟加载,网上虽然已经有很不错的插件,但要为这些效果还得单独加载一个插件的话总感觉有点不舒服,干脆自己写了个方法:
1 |
function loadimg(arr,funLoading,funOnLoad,funOnError){ |
参数说明:
arr:可以是存放图片路径的一个数组,也可以是选取到的img的jquery对象;
funLoading:每一个单独的图片加载完成后执行的操作;
funOnLoad:全部图片都加载完成后的操作;
funOnError:单个图片加载出错时的操作。
如:
1 |
var imgonload=function(errors){ |
调用示例:
console.log("loading..."); |
Jquery实现图片的预加载与延时加载的更多相关文章
- jQuery Lightbox图片放大预览
简介:jQuery Lightbox图片放大预览代码是一款可以在用户点击页面中的小图片时,将该图片的高清版本以Lightbox的方式放大显示在页面的中间,提高用户的体验度. 效果展示 http://h ...
- css+jquery 实现图片局部放大预览
今天有时间开始动手,使用css+jquery实现了图片局部放大的组件,首先看看效果图: 界面设计思路如下: 1.两个div,左边放图片的缩略图 2.在左边缩略图鼠标移动的时候,区域(效果图中的网格) ...
- 图片延时加载原理 和 使用jquery实现的一个图片延迟加载插件(含图片延迟加载原理)
图片加载技术分为:图片预加载和图片延时加载. javascript图片预加载和延时加载的区别主要体现在图片传输到客户端的时机上,都是为了提升用户体验的,延时加载又叫懒加载.两种技术的本质:两者的行为是 ...
- jquery实现图片预加载
使用jquery实现图片预加载提高页面加载速度和用户体,本就为大家详细分析jquery图片预加载的实现原理. 什么时候使用图片预加载? 如果页面使用了很多不是最初加载便可见的图片,有必要进行预加载: ...
- JQUERY 插件开发——LAZYLOADIMG(预加载和延迟加载图片)
开发背景 本插件开发是近期写的最后一个插件了,接下来我想把最近研究的redis最为一个系列阐述下.当然Jquery插件开发是我个人爱好,我不会停止,在将来的开发中我会继续完善,当然也会坚持写这个系列的 ...
- jQuery实现图片预加载提高页面加载速度和用户体验
我们在做网站的时候经常会遇到这样的问题:一个页面有大量的图片导致页面加载速度缓慢,经常会出现一个白页用户体验很不好.那么如何解决这个问题呢?首先我们会想到的是提高服务器性能,使用静态缓存等手段来加快图 ...
- jquery实现图片预加载提高页面加载速度
使用jquery实现图片预加载提高页面加载速度和用户体 我们在做网站的时候经常会遇到这样的问题:一个页面有大量的图片导致页面加载速度缓慢,经常会出现一个白页用户体验很不好.那么如何解决这个问题 呢?首 ...
- jquery插件图片延时加载实例详解
效果预览:http://keleyi.com/keleyi/phtml/image/index.htm 使用方法:1.导入JS插件 <script src="http://keleyi ...
- jQuery.imgLazyLoad图片懒加载组件
一.前言 当一个页面中请求的图片过多,而且图片太大,页面访问的速度是非常慢的,对用户的体验非常不友好:使用图片懒加载,可以减轻服务器的压力,增加页面的访问量,这里主要是总结一下我自己写的图片懒加载组件 ...
随机推荐
- 集成自动化的条形码功能到internet应用程序,网站或自定义Java应用程序的条码控件Java Barcode Package
Java Barcode Package控件是一款条码生成控件,包含所有的JavaBean,Applets,Servlets和类库可以使用于装有Java虚拟机的任何平台,包括Windows®, Lin ...
- 用腻了bootstrap的可以试试semantic-ui
semancti-ui介绍 semantic-ui是html/css框架的新贵,是继bootstrap和foundation之后的又一css神器.semantic-ui一出现在github上就受到火热 ...
- Julia中文教程资源.txt
Julia中文教程资源.txt 2016年3月28日 05:18:32 codegay 本文更新在这里: https://github.com/FGFW/julia-science-and-techn ...
- litepal的jar包
转自http://blog.csdn.net/luohai859/article/details/39292607 LitePal是一款开源的Android数据库框架,它采用了对象关系映射(ORM)的 ...
- 转:Java面试题集(51-70) http://blog.csdn.net/jackfrued/article/details/17403101
Java面试题集(51-70) Java程序员面试题集(51-70) http://blog.csdn.net/jackfrued/article/details/17403101 摘要:这一部分主要 ...
- PAT 06-2 字符串字母大小写转换
没什么好说的,记得使用ctype.h就好了,谭浩强那本书就介绍了,再不使用就太对不起他老人家了:有一点小小的地方需要注意一下,&&的优先级比=号高,所以getchar()两边没有括号的 ...
- js jquery 判断函数是否存在($.isFunction函数的使用)
var fun = "testFun"; // 函数的名称 try{ 3 if($.isFunction(fun)){ } } $.alert(fun +'不是函数!'); } 注 ...
- 团队开发——冲刺1.a
冲刺阶段一(第一天) 1.今天准备做什么? 在了解C#的基础上,深入熟悉Windows窗体应用程序,熟练掌握基本功能. 2.明天做什么:简单设计界面.
- javaweb-dbutils
package cn.itcast.demo; import java.io.File;import java.io.FileNotFoundException;import java.io.File ...
- UVA1476 三分法
单峰函数(即先递增后递减,有极大值的函数),都可以用三分法来求 #include <iostream> #include <cmath> #include <cstdio ...