Question

我有一系列视频和一个音频文件。从音频文件搜索器控件我想控制视频文件的索引。

我希望能够做到这样的事情：

<video mediagroup='test'>
    <source src='video1.webm' type='video/webm'> // 10secs
    <source src='video2.webm' type='video/webm'> // 10secs
    <source src='video3.webm' type='video/webm'> // 10secs
</video>
<audio controls='controls' mediagroup='test'>
    <source src='audio.ogg' type='audio/ogg'>    // 30secs
</audio>

如果我擦洗到音频中的21秒。视频应擦洗到视频3的1秒并可播放。

html5 audio/video属性媒体组为您提供this kind of syncing，但您如何使用一系列视频文件进行操作？

我想我可以用javascript做到这一点，但有没有人知道是否有办法在html中做到这一点？

Answer 1

我不相信你在 mediagroup 或没有Javascript的HTML中可以做的事情。 mediagroup似乎不支持时间偏移;所有媒体元素都需要共享相同的currentTime值。此外，它是not yet supported in Firefox。

如果您确实想尝试使用Javascript，我建议您从Popcorn Inception开始，并查看example。它处理将多个媒体（音频或视频）元素同步到单个主元素，暂停，播放和寻找已经处理过。（我希望在未来几周内修复一些错误。）

值得注意的是，您对<source>元素的使用是不正确的。如果浏览器无法播放一个或多个列出的文件，则视频（或音频）元素可以列出多个源，它可以回退到列表中的其他文件。请参阅：https://developer.mozilla.org/en-US/docs/Web/HTML/Element/source

如何将一系列视频与音频同步

1 个答案: