Html5标签视频在Chrome上不起作用

标签在Firefox和IE浏览器中正常工作，但无法在Chrome上使用。我有两个视频格式，MP4和WebM，Html5标签视频在Chrome上不起作用

下面是HTML

<video playsinline autoplay muted loop poster="8.jpg" id="bgvid"> 

    <source src="8.mp4" type="video/mp4"> 
    <source src="8.webm" type="video/webm"> 

</video>

而且我的CSS

video#bgvid { 
position: fixed; 
top: 50%; 
left: 50%; 
min-width: 100%; 
min-height: 100%; 
width: auto; 
height: auto; 
z-index: -100; 
-ms-transform: translateX(-50%) translateY(-50%); 
-moz-transform: translateX(-50%) translateY(-50%); 
-webkit-transform: translateX(-50%) translateY(-50%); 
transform: translateX(-50%) translateY(-50%); 
background: url(8.jpg) no-repeat; 
background-size: cover; 
}

如果你想看到一个真人版，你可以在这里找到。

https://neevasoft.com/icedrink2/

在此先感谢您的帮助

来源

2017-05-28 Bruno Luiz De Faria

“未找到” 8.JPG可能是原因。 – Pyromonk

您的网站加载了视频，但由于该海报没有显示。海报在您的网站中缺失。请通过移除海报来检查它。 – AdhershMNair

我不认为失踪的海报是问题所在。在codepen上运行良好，海报404'https://codepen.io/mcoker/pen/JNqyLK –