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 相关文章推荐
表单元素与非表单元素刷新区别详细解析
Nov 06 Javascript
jquery如何通过name名称获取当前name的value值
Dec 20 Javascript
js中函数声明与函数表达式
Jun 03 Javascript
基于jQuery实现鼠标点击导航菜单水波动画效果附源码下载
Jan 06 Javascript
jquery Ajax 全局调用封装实例详解
Jan 16 Javascript
React组件生命周期详解
Jul 03 Javascript
利用node实现一个批量重命名文件的函数
Dec 21 Javascript
vue todo-list组件发布到npm上的方法
Apr 04 Javascript
axios封装,使用拦截器统一处理接口,超详细的教程(推荐)
May 02 Javascript
Vue数据驱动表单渲染,轻松搞定form表单
Jul 19 Javascript
使用Layui搭建后台管理界面的操作方法
Sep 20 Javascript
axios实现简单文件上传功能
Sep 25 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
漫威DC御用漫画家去世 他的表情包曾走红网络
2020/04/09 欧美动漫
初学者入门:细述PHP4的核心Zend
2006/09/05 PHP
php面向对象全攻略 (十五) 多态的应用
2009/09/30 PHP
PHP中的Session对象如何使用
2015/09/25 PHP
分享php代码将360浏览器导出的favdb的sqlite数据库文件转换为html
2015/12/09 PHP
超强多功能php绿色集成环境详解
2017/01/25 PHP
PHP长网址与短网址的实现方法
2017/10/13 PHP
PDO::errorInfo讲解
2019/01/28 PHP
js ondocumentready onmouseover onclick onmouseout 样式
2010/07/22 Javascript
Textarea与懒惰渲染实现代码
2012/01/04 Javascript
面向对象的Javascript之三(封装和信息隐藏)
2012/01/27 Javascript
jQuery中removeClass()方法用法实例
2015/01/05 Javascript
javascript动态添加删除tabs标签的方法
2015/07/06 Javascript
JavaScript获取客户端IP的方法(新方法)
2016/03/11 Javascript
Node.js环境下JavaScript实现单链表与双链表结构
2016/06/12 Javascript
学习掌握JavaScript中this的使用技巧
2016/08/29 Javascript
bootstrap中添加额外的图标实例代码
2017/02/15 Javascript
详解nodejs异步I/O和事件循环
2017/06/07 NodeJs
详谈构造函数加括号与不加括号的区别
2017/10/26 Javascript
小程序ios音频播放没声音问题的解决
2018/07/11 Javascript
JS实现秒杀倒计时特效
2020/01/02 Javascript
python静态方法实例
2015/01/14 Python
Python EOL while scanning string literal问题解决方法
2020/09/18 Python
Python正则表达式经典入门教程
2017/05/22 Python
opencv改变imshow窗口大小,窗口位置的方法
2018/04/02 Python
在python中安装basemap的教程
2018/09/20 Python
详解一种用django_cache实现分布式锁的方式
2019/09/01 Python
Python简单实现词云图代码及步骤解析
2020/06/04 Python
会计毕业生自我鉴定
2013/11/04 职场文书
2014爱耳日宣传教育活动总结
2014/03/09 职场文书
家电业务员岗位职责
2014/03/10 职场文书
就业推荐表自我鉴定
2014/03/21 职场文书
省文明单位申报材料
2014/05/08 职场文书
迎国庆演讲稿
2014/09/15 职场文书
《画家和牧童》教学反思
2016/02/17 职场文书
windows11怎么查看wifi密码? win11查看wifi密码的技巧
2021/11/21 数码科技