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 相关文章推荐
js focus不起作用的解决方法(主要是因为dom元素是否加载完成)
Nov 05 Javascript
新浪微博字数统计 textarea字数统计实现代码
Aug 28 Javascript
基于jquery实现控制经纬度显示地图与卫星
May 20 Javascript
jQuery实现延迟跳转的方法
Jun 05 Javascript
JS实现仿雅虎首页快捷登录入口及导航模块效果
Sep 19 Javascript
JS不用正则验证输入的字符串是否为空(包含空格)的实现代码
Jun 14 Javascript
巧方法 JavaScript获取超链接的绝对URL地址
Jun 14 Javascript
javascript创建含数字字母的随机字符串方法总结
Aug 01 Javascript
JS中用三种方式实现导航菜单中的二级下拉菜单
Oct 31 Javascript
Bootstrap轮播图学习使用
Feb 10 Javascript
es7学习教程之Decorators(修饰器)详解
Jul 21 Javascript
详解Vue3 Teleport 的实践及原理
Dec 02 Vue.js
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中文字符串截取函数
2013/11/12 PHP
php封装实现钉钉机器人报警接口的示例代码
2020/08/08 PHP
javascript编程起步(第六课)
2007/01/10 Javascript
DD_belatedPNG,IE6下PNG透明解决方案(国外)
2010/12/06 Javascript
jQuery EasyUI API 中文文档 - ProgressBar 进度条
2011/09/29 Javascript
(跨浏览器基础事件/浏览器检测/判断浏览器)经验代码分享
2013/01/24 Javascript
JavaScript版经典游戏之扫雷游戏完整示例【附demo源码下载】
2016/12/12 Javascript
JS检测数组类型的方法小结
2017/03/14 Javascript
nodejs超出最大的调用栈错误问题
2017/12/27 NodeJs
vue 自定义提示框(Toast)组件的实现代码
2018/08/17 Javascript
VUE实时监听元素距离顶部高度的操作
2020/07/29 Javascript
Vue+Element UI 树形控件整合下拉功能菜单(tree + dropdown +input)
2020/08/28 Javascript
python使用str & repr转换字符串
2016/10/13 Python
利用python3随机生成中文字符的实现方法
2017/11/24 Python
基于Python实现拆分和合并GIF动态图
2019/10/22 Python
python怎么调用自己的函数
2020/07/01 Python
python使用yaml 管理selenium元素的示例
2020/12/01 Python
C++和python实现阿姆斯特朗数字查找实例代码
2020/12/07 Python
HTML5 本地存储之如果没有数据库究竟会怎样
2013/04/25 HTML / CSS
html5 datalist标签使用示例(自动完成组件)
2014/05/04 HTML / CSS
Stuart Weitzman美国官网:美国奢华鞋履品牌
2016/08/18 全球购物
捷克汽车配件和工具销售网站:TorriaCars
2018/02/26 全球购物
澳大利亚在线奢侈品时尚零售平台:Azura Runway
2021/01/13 全球购物
俄罗斯三星品牌商店:Samsungstore
2020/04/05 全球购物
JavaScript获取当前url根目录(路径)
2014/02/19 面试题
HR喜欢的自荐信格式
2013/10/08 职场文书
警校毕业生自我评价
2014/04/06 职场文书
秋季校运会广播稿100字
2014/09/18 职场文书
基层党员群众路线整改措施及努力方向
2014/10/28 职场文书
2015年初中生自我评价范文
2015/03/03 职场文书
2015年卫生监督工作总结
2015/05/21 职场文书
在校生证明
2015/06/17 职场文书
观后感格式
2015/06/19 职场文书
结婚典礼致辞
2015/07/28 职场文书
python 定义函数 返回值只取其中一个的实现
2021/05/21 Python
前端JS获取URL参数的4种方法总结
2022/04/05 Javascript