jquery预加载图片的方法


Posted in Javascript onMay 27, 2015

本文实例讲述了jquery预加载图片的方法。分享给大家供大家参考。具体如下:

这段代码可以在页面打开前对图片进行预加载,这个函数非常有用,可以给用户带来更好的体验。

function preloadImages(oImageList, callback) {
 if ( typeof (oImageList) == 'object' && typeof (callback) === "function") {
  var iCallbackAfter = oImageList.length;
  var iPreloadInterval = window.setInterval(function() {
   if (iCallbackAfter === 0) {
    window.clearInterval(iPreloadInterval);
    callback();
   }
  }, 100);
  $.each(oImageList, function(iIndex, sImage) {
   oImageList[iIndex] = new Image();
   oImageList[iIndex].onload = function(oResult) {
    iCallbackAfter--;
   };
   oImageList[iIndex].onabort = function(oResult) {
    console.log(oResult);
   };
   oImageList[iIndex].onerror = function(oResult) {
    console.log(oResult);
   };
   if (!sImage.match('http://')) {
    sImage = sImage;
   }
   oImageList[iIndex].src = sImage;
  });
 }
}

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
JavaScript 浏览器验证代码(来自discuz)
Jul 17 Javascript
js调试系列 初识控制台
Jun 18 Javascript
D3.js中data(), enter() 和 exit()的问题详解
Aug 17 Javascript
javascript中的五种基本数据类型
Aug 26 Javascript
jQuery简单实现两级下拉菜单效果代码
Sep 15 Javascript
利用jQuery对无序列表排序的简单方法
Oct 16 Javascript
原生javascript实现读写CSS样式的方法详解
Feb 20 Javascript
js中编码函数:escape,encodeURI与encodeURIComponent详解
Mar 21 Javascript
详解Vue用axios发送post请求自动set cookie
May 10 Javascript
JS获取一个表单字段中多条数据并转化为json格式
Oct 17 Javascript
基于ionic实现下拉刷新功能
May 10 Javascript
基于js实现抽红包并分配代码实例
Sep 19 Javascript
jQuery仿gmail实现fixed布局的方法
May 27 #Javascript
js实现键盘Enter键提交表单的方法
May 27 #Javascript
js实现简单锁屏功能实例
May 27 #Javascript
JS实现简单路由器功能的方法
May 27 #Javascript
JavaScript实现将UPC转换成ISBN的方法
May 26 #Javascript
JavaScript对表格或元素按文本,数字或日期排序的方法
May 26 #Javascript
js实现文本框选中的方法
May 26 #Javascript
You might like
PHP操作文件的一些基本函数使用示例
2014/11/18 PHP
php运行时动态创建函数的方法
2015/03/16 PHP
PHP使用递归生成文章树
2015/04/21 PHP
prototype 1.5 & scriptaculous 1.6.1 学习笔记
2006/09/07 Javascript
jquery ui dialog里调用datepicker的问题
2009/08/06 Javascript
30个精美的jQuery幻灯片效果插件和教程
2011/08/23 Javascript
document.getElementBy("id")与$("#id")有什么区别
2013/09/22 Javascript
js字符串转成JSON
2013/11/07 Javascript
js中的时间转换—毫秒转换成日期时间的示例代码
2014/01/26 Javascript
jquery查找tr td 示例模拟
2014/05/08 Javascript
JQuery $.each遍历JavaScript数组对象实例
2014/09/01 Javascript
基于javascript的COOkie的操作实现只能点一次
2014/12/26 Javascript
jQuery超赞的评分插件(8款)
2015/08/20 Javascript
JS实现在状态栏显示打字效果完整实例
2015/11/02 Javascript
JavaScript实战(原生range和自定义特效)简单实例
2016/08/21 Javascript
利用Query+bootstrap和js两种方式实现日期选择器
2017/01/10 Javascript
详解JS异步加载的三种方式
2017/03/07 Javascript
layui表格实现代码
2017/05/20 Javascript
关于javascript作用域的常见面试题分享
2017/06/18 Javascript
JavaScript之json_动力节点Java学院整理
2017/06/29 Javascript
JavaScript函数中的this四种绑定形式
2017/08/15 Javascript
json2.js 入门教程之使用方法与实例分析
2017/09/14 Javascript
jQuery实现动态加载select下拉列表项功能示例
2018/05/31 jQuery
微信小程序如何使用云开发
2019/05/17 Javascript
vue 实现click同时传入事件对象和自定义参数
2021/01/29 Vue.js
[43:49]LGD vs CHAOS 2019国际邀请赛小组赛 BO2 第一场 8.15
2019/08/16 DOTA
Python中字典和JSON互转操作实例
2015/01/19 Python
使用Python的Tornado框架实现一个Web端图书展示页面
2016/07/11 Python
在Django同1个页面中的多表单处理详解
2017/01/25 Python
详解python中sort排序使用
2019/03/23 Python
Python3.6+selenium2.53.6自动化测试_读取excel文件的方法
2019/09/06 Python
Python生成六万个随机,唯一的8位数字和数字组成的随机字符串实例
2020/03/03 Python
基于python SMTP实现自动发送邮件教程解析
2020/06/02 Python
通过CSS3的object-fit来调整图片适配尺寸的技巧简介
2016/02/27 HTML / CSS
村班子对照检查材料
2014/08/18 职场文书
你会写报告?产品体验报告到底该怎么写?
2019/08/14 职场文书