如何讓HTML5視頻同步？

Question

你會說video1.play();其次video2.play();會同時播放視頻，但他們有一個微笑的延遲。你如何消除這種延遲並保持同步？

Answer 1

首先檢查這兩個視頻的readyState大於3，要做到這一點：

• 寄存器canplay事件處理兩個視頻
• 檢查登記兩個處理程序後準備狀態（如果canplay已經在事件處理程序註冊之前觸發視頻）
• 只有在兩者都準備就緒時才啓動視頻

由於網絡問題，這兩個視頻仍然可能不同步，您可以使用requestAnimationFrame輪詢視頻的currentTime屬性，並將它們同步（通過設置currentTime），如果它們相距太遠。