preloadjs预加载

最新推荐文章于 2024-04-25 08:25:53 发布

oNiMing1

最新推荐文章于 2024-04-25 08:25:53 发布

阅读量381

点赞数

文章标签： js javascript

本文链接：https://blog.csdn.net/oNiMing1/article/details/106577192

版权

写了一段preloadjs的预加载，方便以后使用！
如不要显示%进度可删除jquery和下边的监听进度事件

<html>
<script src="https://code.createjs.com/1.0.0/preloadjs.min.js"></script>
<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>


<table width="100%" height="100%" cellpadding="0" cellspacing="0" border="0" bgcolor="#87CEEB">
<tr><td align="center" style="font-size:40px;" id='aas'>加载中...5s<p><font size=3>如长时间不动可<a href='#'>点击进入</a></font><td></tr>
</table>

<script>
function handleComplete() {
document.getElementById('aas').innerHTML ="加载完成";
top.location.href="#"; //进入页面
};
//setTimeout('handleComplete()',5000);


var queue = new createjs.LoadQueue();
queue.installPlugin(createjs.Sound);
queue.loadManifest([
{id: "p1", src:"1.jpg"},
{id: "p2", src:"8.jpg"},
{id: "p3", src:"9.jpg"},
{id: "p4", src:"4.jpg"},
{id: "p5", src:"2.jpg"}
]);

queue.on("fileload",function(e){
document.getElementById('aas').innerHTML ="正在预加载<span id='xxb'></span>..."+e.item.src;
});


//监听进度事件
  queue.on("progress", function(e){
    var proNum = Math.ceil(e.progress * 100);
    $("#xxb").html( proNum + "%");
  });

queue.on("complete", handleComplete, this);
</script>
</html>

oNiMing1

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
preloadjs预加载

写了一段preloadjs的预加载，方便以后使用！如不要显示%进度可删除jquery和下边的监听进度事件<html><script src="https://code.createjs.com/1.0.0/preloadjs.min.js"></script><script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script><script>d
复制链接

扫一扫