`
ch_kexin
  • 浏览: 897810 次
  • 性别: Icon_minigender_2
  • 来自: 青岛
社区版块
存档分类
最新评论

Why won't my HTML5 audio loop?

 
阅读更多

问题：

 

 

The site is up at: http://ajf.me/stuff/eva at the time of writing. The source code is this:

<!DOCTYPE html> 
<htmlstyle="height:100%;"> 
<head> 
<title>eva</title> 
</head> 
<bodystyle="background-color: black;background-image:url('eva.png');background-repeat: no-repeat;background-position: center center;height:100%;margin:0px;padding:0px;"> 
<audioautoplayloop> 
    <sourcesrc="eva.mp3"type="audio/mpeg"/> 
    <sourcesrc="eva.ogg"type="audio/ogg"/> 
    <sourcesrc="eva.wav"type="audio/wav"/> 
</audio> 
</body> 
</html> 

The audio plays fine in Chrome, IE9, and Firefox, but does not loop in the latter. The audio file can't be malformed, as it was produced by Audacity. Is there any other explanation for why it doesn't loop?

回答：

in Chrome, IE9  You can just do this

<audio autoplay loop>

 

Firefox has not yet implemented loop. I would check that you have the newest version of Firefox, but I believe this is still the case. You can check whether or not it is supported with:

if(typeofnewAudio().loop =='boolean') 

If that evaluates to true, then loop is implemented in the browser. If false, then it is not. Add that to your javascript, put an id tag on your audio and use that if statement to check for loop.

if!(typeofnewAudio().loop =='boolean'){ 
    audioToLoop = document.getElementById('audio_id_here'); 
    audioToLoop.addEventListener('ended',function(){ 
        this.currentTime =0; 
        this.play(); 
    },false); 
} 

Then it should loop even in unsupported browsers。

分享到：
| HTML5 使用aduio标签打造音乐播放器【 ...
评论
发表评论

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

相关推荐

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