用promise做图片的预加载
- var url='jsonp-master/0.jpg'
- var url1='jsonp-master/1.jpg'
- var url2='jsonp-master/2.jpg'
- var img=document.createElement('img');
- var img1=document.createElement('img');
- var img2=document.createElement('img');
- img.src=url;
- img1.src=url1;
- img2.src=url2;
- function loading(img){
- return new Promise(function(resolve,reject){
- img.onload=function(){
- resolve(img)
- }
- })
- }
- //图片预加载 等所有图片都加载完毕后统一显示
- Promise.all([
- loading(img),loading(img1),loading(img2)
- ]).then(function(res){
- for(var i=0;i<res.length;i++){
- document.body.appendChild(res[i])
- }
- })
- //谁加载的快就显示谁
- Promise.race([
- loading(img),loading(img1),loading(img2)
- ]).then(function(res){
- document.body.appendChild(res)
- })
用promise做图片的预加载的更多相关文章
- Promise实现多图预加载
Promise正如它的中文意思“承诺”一样,保存着未来会发生事件(一般为异步操作).Promise避免了“回调地狱”,写法更加接近同步操作.说到同步,我更加喜欢async.await,它们书写更贴近同 ...
- JS 实现图片的预加载(转载)
图片预加载是web开发中一种应用相当广泛的技术,比如我们在做图片翻转显示等特效的时候,为了让图片在转换的时候不出现等待,我们最好是先让图片下载到本地,然后在继续执行后续的操作. 下面的函数实现了一个我 ...
- [转]Javascript实现图片的预加载详解
下面的函数实现了一个我们想要的最基本的图片预加载效果 function preloadimages(arr){ var newimages=[] var arr=(typeof arr!=" ...
- Javascript实现图片的预加载的完整实现
图片预加载是web开发中一种应用相当广泛的技术,比如我们在做图片翻转显示等特效的时候,为了让图片在转换的时候不出现等待,我们最好是先让图片下载到本地,然后在继续执行后续的操作.今天我们将来实现一个完整 ...
- ViewPager做图片浏览器,加载大量图片OOM的问题修正
/** * @author CHQ * @version 1.0 * @date 创建时间: 2016/7/26 17:18 * @parameter * @return * 图片查看器 * //可以 ...
- Jquery实现图片的预加载与延时加载
有很多项目经常会需要判断图片加载完成后执行相应的操作,或者需要图片延迟加载,网上虽然已经有很不错的插件,但要为这些效果还得单独加载一个插件的话总感觉有点不舒服,干脆自己写了个方法: 1 2 3 4 5 ...
- flex 实现图片播放 方案一 图片全部预加载放内存
这种方案,对于web的应用有局限性,在图片量比较多,比较大的时候,就会爆浏览器异常.一般建议轻量级的采用这种方案. <?xml version="1.0" encoding= ...
- ajax点击加载更多数据图片(预加载)
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- Javascript图片预加载详解
预加载图片是提高用户体验的一个很好方法.图片预先加载到浏览器中,访问者便可顺利地在你的网站上冲浪,并享受到极快的加载速度.这对图片画廊及图片占据很大比例的网站来说十分有利,它保证了图片快速.无缝地发布 ...
随机推荐
- Java 练习:字符串反转
package com.swift; public class String_Reverse_Test { public static void main(String[] args) { /* * ...
- Eclipse+Tomcat搭建jsp服务器
首先,安装java sdk 环境,这里就不多说了,附上java sdk的下载地址:http://www.oracle.com/technetwork/java/javase/downloads/jdk ...
- 关于UINavigationController的一些技巧
未自定义任何东西的导航条效果如下: 1.自定义了 leftBarButtonItem 之后,左滑返回手势失效了,解决办法: self.navigationController.interactiveP ...
- 04Windows中的字符类型
1. Windows 中常用的数据类型定义 //WinNt.h中定义 typedef unsigned short wchar_t; //A 16-bit character typedef char ...
- 08GNU as汇编
1. 概述 由于操作系统许多关键代码要求有很高的执行速度和效率,因此在一个操作系统源代码中通常就会包含大约 10% 左右的起关键作用的汇编语言程序量.Linux 操作系统也不例外,它的 32 位初 ...
- linux 上安装配置l2tp的客户端
有些时候我们外网linux服务器需要访问内网的服务器,这时候就需要在外网服务器上配置l2tp的客户端,连接到VPN访问内网服务器. 安装: yum -y install xl2tpd ppp 安装成功 ...
- 剑指Offer(书):顺时针打印数组
题目:输入一个矩阵,按照从外向里以顺时针的顺序依次打印出每一个数字,例如,如果输入如下4 X 4矩阵: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 则依次打印出数字1 ...
- JDK1.8 HashMap$TreeNode.balanceInsertion 红黑树平衡插入
红黑树介绍 1.节点是红色或黑色. 2.根节点是黑色. 3.每个叶子节点都是黑色的空节点(NIL节点). 4 每个红色节点的两个子节点都是黑色.(从每个叶子到根的所有路径上不能有两个连续的红色节点) ...
- debiand上安装thunderbird
deb包下载地址 http://sourceforge.net/projects/ubuntuzilla/files/mozilla/apt/pool/main/t/thunderbird-mozil ...
- Java技术——Java反射机制分析
)生成动态代理. 2. Java反射API 反射API用来生成在当前Java虚拟机中的类.接口或者对象的信息. Class类:反射的核心类,可以获取类的属性,方法等内容信息. Field类:Java. ...