先将两个简单的兼容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等格式音乐播放器就总结这么多。