栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 软件开发 > Web开发 > JavaScript

使用PreloadJS加载图片资源的基础方法详解

JavaScript 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

使用PreloadJS加载图片资源的基础方法详解

一. 使用createjs里的LoadQueue函数实现异步加载图片,监听加载进度 1.实例对象LoadQueue加载队列对象
var queue = new createjs.LoadQueue(false);
2.需要监听常用到的三个方法
//监听进度事件
queue.on("progress", function (e) {
   
});
//监听加载事件
queue.on("fileload", function (e) {
 
});
//监听完成事件
queue.on("complete", function (e) {
 
});
3.实现监听进度

html代码:

loading...0%

js代码:

//监听进度事件
queue.on("progress", function(e){
  var pronum = Math.ceil(e.progress * 100);
  $("#progress").html( pronum + "%");
});
4.添加加载资源
//加载单个图片
queue.loadFile("images/arrow.png");
//加载单个图片,带id
queue.loadFile({id: "img1", src:"images/slide3-bg.png"});
//加载多个文件,指定目录下
queue.loadManifest([
  "slide1-bg.png",
  "slide2-bg.png",
  "slide3-bg.png"
], true, "images/");
5.获取加载完的资源
queue.on("fileload", function (e) {
  document.body.appendChild(e.result);
});
二:完整的代码



  
  PreloadJs加载图片



loading...0%





更多关于PreloadJS加载页面资源的相关文章请点击下面的相关链接

转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/71553.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号