视频开始前PhoneGap内联html5视频黑闪

Question

我有一个 HTML5 视频，只有在通过 phonegap 编译时才会闪烁黑色。视频开始时，海报和视频的第一帧之间会出现黑色闪光。闪光持续 0.5 秒到 5 秒。当我使用完全相同的页面并在浏览器而不是 phonegap 中运行它时，它会从海报到视频无缝播放。

如果我播放一次视频并重新播放，没有闪光灯，这只是第一次。我在等待视频完全加载的足够时间的同时对此进行了测试，所以并不是它们还没有完全加载。

我可以想出一些技巧来解决这个问题，但我希望有一个干净的解决方案。

Javascript：

onVideoExit()
videoElement.currentTime = 0;
videoElement.pause();

onVideoEnter()
videoElement.play();

HTML：

<div>
    <video  width="140" height="210" webkit-playsinline preload>
        <source src=http://www.w3schools.com/html/mov_bbb.mp4 type="video/mp4">
    </video>

</div>

config.xml：

<preference name="AllowInlineMediaPlayback" value="true" />

Answer 1

您可以尝试添加事件侦听器以了解视频何时正确加载。

var theVideo = document.getElementById("myAwesomeVideo");
theVideo.addEventListener('loadeddata', function() {
    theVideo.play();
});