js加载完所有的图片,适合电子相册哦~~~~
有些时候要一口气加载完所有的图片,所以代码就要这么写。。。。
var imgArray = [
'http://s16.mogucdn.com/p1/160202/upload_ifqwcmlcmyywmnrxgyzdambqgyyde_750x1206.jpg',
'https://img.alicdn.com/tps/TB19uTbLpXXXXaEaXXXXXXXXXXX-520-280.jpg',
'http://s18.mogucdn.com/p1/160203/upload_ifqwizbthaztgyzxgyzdambqgyyde_666x610.png',
'http://s18.mogucdn.com/p1/160203/upload_ifrdcmlcge4tgyzxgyzdambqmeyde_743x242.png',
'http://imgsrc.baidu.com/forum/pic/item/8d5494eef01f3a2957d7fc4a9925bc315c607c12.jpg',
'http://img.bizhi.sogou.com/images/2013/01/29/330291.jpg',
'http://s16.mogucdn.com/p1/160202/upload_ie4wmzbwmvsdcobxgyzdambqgqyde_750x1334.gif',
'http://s16.mogucdn.com/p1/160202/upload_ifqwcmlcmyywmnrxgyzdambqgyyde_750x1206.jpg',
'http://s18.mogucdn.com/p1/160203/upload_ifqwizbthaztgyzxgyzdambqgyyde_666x610.png',
'http://s18.mogucdn.com/p1/160203/upload_ifrdcmlcge4tgyzxgyzdambqmeyde_743x242.png',
'http://s16.mogucdn.com/p1/160201/upload_ifrwinrugntdqmzxgyzdambqhayde_750x1206.jpg',
'http://s16.mogucdn.com/p1/160202/upload_ie4wmzbwmvsdcobxgyzdambqgqyde_750x1334.gif'
]; function imgLoad(url,callback) {
var img = new Image();
img.src = url;
if (img.complete) {
if(typeof(callback)==='function') callback();
} else {
img.onload = function () {
if(typeof(callback)==='function') callback();
img.onload = null;
};
}
} function preImgLoad(array,callback){
var index = 0;
while(index < array.length){
if(index==array.length-1){
imgLoad(array[index],callback)
}else{
imgLoad(array[index],array[index+1])
}
index ++;
}
} preImgLoad(imgArray,function(){console.log('图片已经全部加载成功')})
睡觉去。。。。
js加载完所有的图片,适合电子相册哦~~~~的更多相关文章
- web项目中js加载慢问题解决思路
最近使用Echarts地图(版本为echarts2,echarts3目前无法下载地图版). 问题描述:之前使用require形式加载,地图首次加载显示要6-7秒,难以接受. js配置代码如下: < ...
- jquery的ready方法(DOM是否加载完)详解与使用
jquery的ready方法(准备DOM触发)还是比较复杂的,我们先看流程图:
- js图片未加载完显示loading效果
<html> <title>js图片未加载完显示loading效果</title> <body> <style> img{float:lef ...
- (js有关图片加载问题)dom加载完和onload事件
引用旺旺的话...哈哈哈DOMContentLoaded事件表示页面的DOM结构绘制完成了,这时候外部资源(带src属性的)还没有加载完.而onload事件是等外部资源都加载完了就触发的.$.read ...
- pyspider 示例二 升级完整版绕过懒加载,直接读取图片
pyspider 示例二 升级完整版绕过懒加载,直接读取图片,见[升级写法处] #!/usr/bin/env python # -*- encoding: utf-8 -*- # Created on ...
- 网页图片很多时,加载完后再加载图片(defer:延迟加载)
图片影响页面加载速度,可以先加载完页面,再去加载图片. defer:告诉浏览器,这里面的js代码不影响网页脚本解析,可以解析完html脚本再执行这段js代码(个人理解). 网页代码:<img s ...
- js判断图片加载完成后获取图片实际宽高
通常,我们会用jq的.width()/.height()方法获取图片的宽度/高度或者用js的.offsetwidth/.offsetheight方法来获取图片的宽度/高度,但这些方法在我们通过样式设置 ...
- 移动web图片加载完获取img宽高
1.vue中 @load=function(){} 等待img加载完触发load函数 2.window.load=function(){var imgheight=$(".btnimg& ...
- js页面加载完后执行(document.onreadystatechange 和 document.readyState)
js页面加载完后执行javascript(document.onreadystatechange 和 document.readyState) document.onreadystatechange ...
随机推荐
- CocoaPods的那些坑
CocoaPods的那些坑 文章转自http://blog.csdn.net/zhanniuniu/article/details/52159362#comments 我跟博主的经历超级像!不过自己用 ...
- 在linux上如何通过composer安装yii
Composer可以理解成一个依赖管理工具 它能解决以下问题 a) 你有一个项目依赖于若干个库. b) 其中一些库依赖于其他库. c) 你声明你所依赖的东西. d) Composer 会找出哪个版 ...
- CSS选 择器 三种样式
一.CSS三种样式 代码 宽度 高度 实线 颜色 A内联样式是优先级最高的方式 px必须写 A:内联式 弊端:代码多很乱 <body> <div class="divc ...
- Linux终端使用代理服务器
1.YUM添加代理服务器: [root@localhost /]# vim /etc/yum.conf 添加如下项目: proxy=http://172.16.1.188:8888/2.WGET添加代 ...
- Debian8 从本地源安装软件
假如你从Debian官网下载了三个DVD镜像,那么就可以设置从本地源来安装软件,例如这里我从官网下载了 debian-8.6.0-amd64-DVD-1.iso,debian-8.6.0-amd64- ...
- SolrQuery的使用
查询的总结:一般查询分为以下几个步骤: 1.创建查询对象 2.创建查询条件 3.执行查询,这里注意要有返回值 4.对查询结果进行取出 public void queryDocument() throw ...
- MySQL 代码开发注意事项----开发高性能的sql
序言 一个服务或者一个程序,由 程序+数据组成.在数据这块,计算机中IO是比CPU要慢得多,为了减少IO,减少CPU运算.我们第一时间会想到索引,但索引为啥会提高效率,因为可以减少IO,在查询的时候不 ...
- 纯CSS3实现动态导航栏目
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Jmeter教程 简单的压力测试
Jmeter教程 简单的压力测试:http://www.cnblogs.com/TankXiao/p/4059378.html
- 关于Nginx的一些优化(突破十万并发)
nginx指令中的优化(配置文件) worker_processes 8; nginx进程数,建议按照cpu数目来指定,一般为它的倍数. worker_cpu_affinity 00000001 00 ...