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

Question

该标记在 firefox 和 IE Explorer 上运行良好，但在 Chrome 上不起作用。我有两种视频格式，mp4 和 webm。

这是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/

在此先感谢您的帮助

Answer 1

您的源文件链接无效。如果您将上述 url 用于您的 src 属性，您需要将视频放在与您的 index.html 文件相同的级别，并且您的文件结构中该级别没有任何视频。或者将它们放在其中一个文件夹中并相应地更改 src url。