将一个视频同步到另一个

Question

情况是这样的-我有两个视频，彼此重叠。这些视频几乎是相同的（在内容方面），当您进入页面时，视频1开始播放。还有一个按钮，当按下该按钮时，它会将第二个视频同步到第一个视频，并逐渐淡入（首先隐藏）。

我遇到的问题是同步，当我尝试设置第二个视频的currentTime时，播放器显然会首先缓冲一些帧，然后开始播放，从而导致不同步。我还尝试了一些同步超时，每10ms设置一次currentTime，直到第二个视频的readyState变为4，但这会造成很大的延迟。

到目前为止我正在使用的代码：

function switchVideo(first, second) {

    var currentTime = first.currentTime;
    second.pause();
    second.currentTime = currentTime;
    second.play();
    syncAllowed = true;

    var videoInterval = setInterval(function() {
        if(next.readyState >= 4) {
            second.addClass('show');
            syncAllowed = false;

            setTimeout(function() {
                first.pause();
            }, 500);

            clearInterval(videoInterval);
        }
    }, 100);
}

var syncVideos = setInterval(function() {
    if(syncAllowed) {
        second.currentTime = first.currentTime;
    }
}, 10);

问题是，有没有办法将一个视频同步到另一个正在播放的视频，而在设置当前时间后，第一视频获取足够的数据播放时不会有太多延迟？我还注意到，时间上有些滞后，这很奇怪，因为那部分视频应该已经被缓冲了。

感谢任何提示！