HTML5视频加载时显示黑屏

Question

我尝试使用HTML5和angularJS加载视频。但视频最初显示黑屏然后开始播放。它只发生在Android Chrome浏览器中。

我尝试了海报图像，并检查了视频的readyState（仅在获取readyState值4后才称为播放功能）。但最初的黑屏问题尚未解决。

这是我的HTML：

<div class="load-image"></div>
<div class="video-poster" style="display: none;">
    <video id="video_intro" height="413" width="595" src="assets/video/video.mp4" poster="assets/images/mobile/image.png"></video>
</div>

我的Javascript代码：

myVideo.load();
$('.fireneuron-button, .animate-button').click(function () {
    var myVar = setInterval(function () {
        var ready = myVideo.readyState;
        if (ready == 4) {
            myVideo.play();
            clearInterval(myVar);
        }
    }, 1000);
});

非常感谢任何帮助。