HTML5视频标签不播放

我试图利用HTML5视频标签在页面加载时自动播放mov或mp4视频。但是，视频在页面加载时不播放。这里是我的代码：HTML5视频标签不播放

<!DOCTYPE html> 
<html lang="en-US"> 
<head> 
<meta charset="utf-8" /> 
<title>Bropocalypse</title> 
<style> 
body {background:#000000; 
margin:100px;} 

p {font-size:36px; 
text-align:right; 
margin:20px 0px;} 

a:link, a:hover, a:visited {color:#FF0000; 
text-decoration:none;} 

.trailer {width:700px; 
height:100%; 
margin:0 auto;} 
</style> 
</head> 
<body> 
<div class="trailer"> 
    <video width="700" height="400" src="trailer.mp4" poster="trailer.mp4" controls="controls" autoplay="autoplay" type="video/mp4; codecs='avc1.42E01E, mp4a.40.2'"> 
    <p>If you are reading this, it is because your browser does not support the HTML5 video element.</p> 
    </video> 
<p><a href="about.php"><img src="images/skip.png" alt="SKIP >>" /></a></p> 
</div> 
</body> 
</html>

该页面可以在这里找到：http://www.tcnj.edu/~moore56/game-design/bropocalypse/。请让我知道你可能有的任何建议或问题。谢谢。

来源

2012-06-04 myrmidon16

你使用哪个浏览器和哪个版本？ – Sarfraz

我使用的是Chrome，但我也希望它至少可以在Firefox中工作。 – myrmidon16

首先，尝试使用HTML5文档而不是XHTML 1.0文档。

我测试了你的代码，但它并不适合我，但是，当我用一个测试.m4v视频（从here）替换视频时，它立即在我的Chrome浏览器上运行，所以问题似乎没有使用HTML代码。

还要注意，您正在使用文本/纯文本内容类型来提供视频文件，这是不对的。

来源

2012-06-04 18:44:58 eis

我已经编辑了视频标签的标题和内容类型，但它仍然不起作用。建议？（更新原始文章） – myrmidon16

好吧，我说的是，这个问题是与您的视频文件（格式）。它需要[支持的格式]（http://en.wikipedia.org/wiki/HTML5_video#Table），否则它将无法正常工作。 – eis

是的，正如eis所说如果您手动重命名视频格式，它会在您的机器上运行良好，但编解码器不匹配导致视频不能在浏览器中播放。此外，你应该把一个背景格式和一个对象标签嵌入到你的浏览器中的视频...

来源

2013-01-30 20:47:08 prem

HTML5视频标签不播放

回答

相关问题