0

我在加载画布游戏时遇到问题。

我有很多图片，一种音效和背景音乐。在 PC 上，一切都会很好地加载。问题出在手机上，我的网速很慢。图像加载，但声音和背景音乐在游戏开始后下载。

代码示例：

main = getElementById('wrapp');
bg = new Image();
bg.src = 'bg.png';

msound = new Audio('main.wav');
msound.volume = .05;
msound.load();
msound.loop = true;
msound.play();

sound = new Audio('jump.wav');
sound.volume = .20;
sound.load(); 

main.addEventListener('touchstart', function() {
     sound.play();
}

//some game functions

function Update() {
    //some functions 
}

function Start() {
    Update();
    requestAnimFrame(Start);
}

如何让页面加载所有内容然后运行游戏？例如：可能有一条信息“请稍候...”，并且在图像和声音加载后，画布将显示出来。

4

1 回答 1

2

这是快速肮脏的解决方案：

mainsound.addEventListener("canplay", function()
{
   mainsound.play();
   Start();
});

但是，适当的解决方案应包括：

  1. 设计一个类，负责媒体的加载
  2. 等待加载所有媒体。（你可以使用“$(window).load()”和“oncanplay”事件的组合。如果你不喜欢jQuery，你可以在谷歌中寻找这样的东西
  3. 从那里开始游戏
于 2013-05-09T18:24:41.053 回答