Html5视频加载不当

Question

我有一个项目我在悬停时在弹出窗口中实现自动播放html5视频。一切都接近正常，但是在Chrome中，当您将鼠标悬停在视频上时，弹出窗口中会有一个小黑框，瞬间完成。

现在，我确定这与拉动视频和加载视频所需的时间有关。我不确定如何有效地对抗它。也许以某种方式延迟播放或确保在onMouseover()之前加载？

可以找到项目here

Answer 1

您可以在加载媒体之前显示加载动画。要知道如何，请阅读Tell whether video is loaded or not in Javascript 如果有很多视频，要加载所有视频对用户来说会很麻烦。

检查视频是否准备就绪

if ( yourVideoElement.readyState === 4 ) {
    // it's loaded
}