HTML 视频并不总是在 Chrome 中播放

Question

加载页面（单击index.html）时，视频无法播放。按几次 F5 后就可以播放了。每当我打开 index.html 文件时，视频几乎从不播放。

视频加载时卡在第一帧，就像图片一样。刷新 1/2 次后，它会播放，但在第一次加载时不会播放。

此问题出现在 Google Chrome 上。

在 Firefox 上，它在第一次加载时起作用。

在 Internet Explorer 上，它也适用于首次加载。

<video id="vid" class="backvid" autoplay loop>
<source src="assets/vids/bg.mp4" type="video/mp4">
</video>

这是我使用过的代码。我不知道如何针对这个问题发布 jsfiddle 或代码片段，因为它包含一个视频。也许可以在加载时强制刷新视频，但我不知道如何编码。

Answer 1

<video id="vid" class="backvid" autoplay loop>
    <source src="assets/vids/bg.mp4" type="video/mp4">
</video>

<style>
   .backvid{
     display:none;
   }
</style>

<script>
$(document).ready(function(){
      $(".backvid").show();
});
</script>

出于某种原因，如果你添加.show()它就会起作用。

您必须使用jQuery此解决方案才能发挥作用。