我有以下代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<video width="400" autoplay>
<source src="../Videos/mov_bbb.mp4" type="video/mp4">
<source src="../Videos/mov_bbb.ogg" type="video/ogg">
<source src="../Videos/mov_bbb.webm" type="video/webm">
Your browser does not support autoplay HTML5 video tag.
</video>
<p><span>Video courtesy of </span><a href="http://bigbuckbunny.org/" target="_blank">Big Buck Bunny</a></p>
</body>
</html>
在Firefox中打开文件后,一切都按预期工作。
但是,在Chrome或Opera中打开文件后,静止图像即将到来,并且没有任何事情发生。
为什么会这样?
我使用的是Ubuntu 18.04
一点解决方法。在关闭/video
标签后添加以下内容可以正常工作。
<script>
document.getElementById('vid').play();
</script>
那对你有用吗?
编辑:经过一些额外的挖掘,我偶然发现了这个帖子https://stackoverflow.com/a/42414858/6524598。看来,如果视频的音频被静音,则chrome仅尊重视频的自动播放。这意味着以下内容对您也许有用:
<video width="400" autoplay muted >
<source src="../Videos/mov_bbb.mp4" type="video/mp4">
<source src="../Videos/mov_bbb.ogg" type="video/ogg">
<source src="../Videos/mov_bbb.webm" type="video/webm">
Your browser does not support autoplay HTML5 video tag.
</video>