HTML5视频自动播放，但延迟时间为5秒 [英] HTML5 video autoplay but with a 5 seconds of delay

问题描述

我有一个20秒长的HTML5视频循环作为我网页的背景，并设置为自动启动。是否可以将视频自动播放延迟5秒？我试图让视频在尝试播放之前完全加载，以防止它出现干扰。这是我目前的代码：

I have a 20 second long HTML5 video loop as the background on my webpage and it is set to autostart. Is it possible to delay the video autoplay for 5 seconds? I am trying to allow the video to load completely before trying to play to prevent it from stuttering as much. Here is my current code:

<video id="video_background" poster="images/dmm_background.jpg" controls="controls" preload="true" autoplay="true" loop="loop" muted="muted" volume="0"> 
<source src="videos/backgroundvideo.mp4" type="video/mp4"> 
<source src="videos/backgroundvideo.webm" type="video/webm">
</video>
</video>

非常感谢任何帮助!!

Any help is greatly appreciated!!

推荐答案

HTML：

<video id="myVideo" src="http://www.quirksmode.org/html5/videos/big_buck_bunny.mp4">

JavaScript：

JavaScript:

setTimeout(function(){
  document.getElementById("myVideo").play();
}, 5000);

JSFiddle示例。

这篇关于HTML5视频自动播放，但延迟时间为5秒的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！