在背景音乐中添加两秒延迟

Question

这是我编写的用于在后台播放音乐的代码。我怎样才能在其中添加两秒的延迟？这将为图像完全加载留出时间

<!DOCTYPE html>
<html>
<head>
<title>Animate</title>
<script type="text/javascript">
     var isChrome = /Chrome/.test(navigator.userAgent) && /Google 
Inc/.test(navigator.vendor);
        if(!isChrome){
  $('#iframeAudio').remove()
}
else{
 $('#playAudio').remove() //just to make sure that it will not have 2x audio 
in the background 
}
</script>
</head>
<body>
<iframe src="Happy Birthday Song.mp3" allow="autoplay" style="display:none" id="iframeAudio">
</iframe> 
<audio autoplay loop  id="playAudio">
  <source src="Happy Birthday Song.mp3">
</audio>
</body>
</html>

Answer 1

您好，这是我建议您应该做的。首先删除音频标签上的自动播放属性。

然后您可以使用javascript或jquery来控制音频何时播放。在您的情况下，您希望在加载所有资产时播放音频..所以这是一个例子..

//javascript
 window.onload = function() {
   document.getElementbyId("playAudio").play();
 }
 //jquery
 $(document).ready(function() {
   $("#my_audio").get(0).play();
 });

如果出于任何原因你仍然想要更多的延迟，比如 2 秒..你可以进一步延长......

var myAudio = document.getElementById("playAudio");
//javascript
window.onload = function() {
      setTimeout(function(){
       myAudio.play();
   }, 2000);
 }

 //jquery

 $(document).ready(function() {
     setTimeout(function(){
       $("#my_audio").get(0).play();
     }, 2000);    
 });

PS。使用两者中的任何一个。我记得你说过你不熟悉JS的时候。祝朋友好运

Answer 2

这是我想到的。下面的脚本添加了一个 3-second

<script type="text/javascript">
     window.setTimeout(function () {
    var iframe = document.getElementById('my_audio');
    iframe.setAttribute('src', 'Happy Birthday Song.mp3');
}, 3000); 
</script>

'my_audio' 是 iframe id。

<iframe style="display:none" id="my_audio">
</iframe>

为您自己的音乐

iframe.setAttribute('src', 'your music here');

在背景音乐中添加两秒延迟

Adding a two second delay into background music

html

javascript

google-chrome

appcelerator