Chrome浏览器不会加载HTML5视频

我有一个培训网站的视频带有jQuery导航栏。Chrome浏览器不会加载HTML5视频

所有带有文本描述的视频都会在自己的div标签中加载。

所有div标签是由通过display: none;隐藏的，当用户点击了jQuery导航显示的共同赞助div标签的部分通过display: block;

我的整个系统的伟大工程，在Firefox，Safari和IE浏览器。

但铬只是不断处理页面，并没有停止。除此之外，我的HTML中的后半部分视频根本无法播放。

每个其他浏览器都会立即加载页面，并且导航功能可以完美地查看所有可用的视频。

HTML5视频正在显示的代码如下图所示：

  <video id="video" width="100%" height="auto" controls> 

       <source src="6-steps-to-becoming-an-elite-internet-marketer/_/video/mp4/part-4-2-effgijfrcx.mp4" type="video/mp4"> 
       <source src="6-steps-to-becoming-an-elite-internet-marketer/_/video/ogv/part-4-2-effgijfrcx.ogv" type="video/ogg"> 

       Oppps! Your browser appears to not be able to play this video. Please update it! 

      </video>

来源

2015-08-22 Jack Trowbridge

我不知道jQuery如何处理任何内容，但是您的确切标记在我的Chrome中使用mp4，因此没有足够的信息。 – Rob

这个问题似乎在于我的HTML中有15个左右的视频是通过CSS隐藏的。 Chrome似乎试图加载它们全部，它只会在8点之前加载，然后当我的jQuery导航通过CSS可见时，没有更多的视频可以播放。铬页面永远处理..每个其他浏览器似乎没有问题立即加载和所有视频加载完美无瑕。 –

这种行为是非常典型的Chrome。 Chrome试图同时加载所有15个视频，但它只允许自己同时打开多个服务器的连接。它无法知道哪些视频优先。

我建议将preload="metadata"添加到您的所有视频标签。当给定的视频变得可见时，您可以拨打开始缓冲。或者开始播放它。

我有一个案例研究更详细的解释，面对同样的问题： http://www.pbs.org/pov/blog/povdocs/2014/09/empire-case-study-part-1/

您可能仍然会碰到的问题，如果用户开始显露快速连续多部影片。在这种情况下，您可能需要强制隐藏的视频停止缓冲，方法是将src设置为空字符串，然后调用。当该视频再次显示时，您必须再次设置src。

来源

2015-08-24 04:45:51 brianchirls

Chrome浏览器不会加载HTML5视频

回答

相关问题