js实现网页mp3等格式音乐播放器兼容IE、FireFox、Chrome、Opera
先将两个简单的兼容IE、chrome的播放mp3等格式播放器。
IE、Firefox浏览器:
<object data=”music.mp3″ type=”application/x-mplayer2″ width=”0″ height=”0″>
<param name=”src” value=”music.mp3″>
<param name=”autostart” value=”1″>
<param name=”playcount” value=”infinite”>
</object>
Chrome其他浏览器:
<embed id=”Player” name=”Player” src=”music.mp3″ width=200 height=100 type=audio/mpeg autostart=true loop=true>
后面实例讲下利用js实现可兼容IE、FireFox、Chrome、Opera等浏览器的音乐播放器,支持mp3、wma等格式。
实现方法如下:
<script type="text/javascript">
/** 音乐播放器
* @param obj 播放器id
* @param file 音频文件 mp3: ogg:
* @param loop 是否循环
*/
function audioplayer(id, file, loop){
var audioplayer = document.getElementById(id);
if(audioplayer!=null){
document.body.removeChild(audioplayer);
}
if(typeof(file)!='undefined'){
if(navigator.userAgent.indexOf("MSIE")>0){// IE
var player = document.createElement('bgsound');
player.id = id;
player.src = file['mp3'];
player.setAttribute('autostart', 'true');
if(loop){
player.setAttribute('loop', 'infinite');
}
document.body.appendChild(player);
}else{ // Other FF Chome Safari Opera
var player = document.createElement('audio');
player.id = id;
player.setAttribute('autoplay','autoplay');
if(loop){
player.setAttribute('loop','loop');
}
document.body.appendChild(player);
var mp3 = document.createElement('source');
mp3.src = file['mp3'];
mp3.type= 'audio/mpeg';
player.appendChild(mp3);
var ogg = document.createElement('source');
ogg.src = file['ogg'];
ogg.type= 'audio/ogg';
player.appendChild(ogg);
}
}
}
/*js调用音乐播放器代码*/
var file = [];
file['mp3'] = 'music.mp3';
file['ogg'] = 'music.ogg'; //此格式为兼容IE外部分浏览器
audioplayer('audioplane', file, true); // 播放(true为是否循环播放)
audioplayer('audioplane'); // 停止
</script>
演示地址:点击进入
好了,js实现网页mp3等格式音乐播放器就总结这么多。
本博文章基本上属于原创或收集整理,都是心血结晶。
欢迎转载分享,转载请注明出处,谢谢!
本文地址:js实现网页mp3等格式音乐播放器兼容IE、FireFox、Chrome、Opera