`
128kj
  • 浏览: 583733 次
  • 来自: ...
社区版块
存档分类
最新评论

HTML5 Canvas学习笔记(3)加载游戏/动画音乐

html5JavaScripthtml游戏音乐 
阅读更多
   先要准备应付各种浏览器的声音文件，什么.mp3,.ogg,.wav等格式。还是看例子吧

<body>
<div id="progressText"></div>
</body>

<script>
  //音频播放   
    var loadAudioLen=0;//已加载的声音数
    var AudioList={};//缓存已加载的声音
    var audiolen=2;//要加载的声音总数
  
    function  audioOnload(Audio){
       loadAudioLen++;
        AudioList[Audio.playname] = Audio;
       document.getElementById('progressText').innerHTML = '正在加载音乐...(' + Audio.playname;
        if(loadAudioLen==audiolen){//所有声音加载完成后执行init()
            init();
        }
    }

    function init(){
      document.getElementById('progressText').innerHTML = '正在播放音乐...' +  AudioList["bg"].playname;
      AudioList["bg"].play();//要播放声音，只要这样做就行了。

   }

//支持声音的类型
(function(){
     var types=  {
        'mp3' : 'audio/mpeg',
        'ogg' : 'audio/ogg',
        'wav' : 'audio/wav',
        'aac' : 'audio/aac',
        'm4a' : 'audio/x-m4a'
    }

    //获取文件的扩展名
    function getExt(filename) {
            return filename.split('.').pop();
        }

    var audioList = { //要加载的清单
        bg:   ["audio/bg.ogg","audio/bg.wav","audio/bg.mp3"],
        click:   ["audio/click.ogg","audio/click.wav","audio/click.mp3"]

    };

    //循环上面的清单
    for(name in audioList){
        var Audio = document.createElement('audio');//创建audio元素
         var source = document.createElement('source');//创建source元素
         var srcArray = audioList[name];//取到要加载的各种声音文件数组
         for(var i=0;i<srcArray.length;i++){
            source.src=srcArray[i];
            source.type = types[getExt(source.src)];
            Audio.appendChild(source);
         }

        Audio.playname = name;
        Audio.onloadeddata=audioOnload(Audio);
        Audio.onerror = function(e){
            alert("资源加载时发生错误！"+this.playname);
        }
    }
})();

</script>


欢迎访问博主的网站：http://www.108js.com

本学习笔记实例代码请下载：
0
顶
0
踩
分享到：
| HTML5 Canvas学习笔记(2)菜单高亮显示与像 ...
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics