将rangeslider.js用于HTML5音频时间擦除器

时间:2015-05-21 12:54:58

标签: javascript jquery html5 audio slider

我正在深入研究Andre Ruffert's rangeslider.js的细节,我很难将他的代码整合到控制和响应简单的HTML5音频元素中。

我看到您可以通过单击按钮以编程方式更改滑块的值,但是我如何链接音频以在播放时自动更新音频,并通过单击并拖动拇指来修改音频滑块?

1 个答案:

答案 0 :(得分:2)

我在这里做了一个工作演示:http://jsfiddle.net/alan0xd7/79ff562k/

这使用timeupdate事件来更新范围滑块。

然而,当你试图在播放时改变时间时会有一些怪癖 - 有时它会快速回到原来的位置。我相信这是某种竞争条件,因为当你滑动赛道时,timeupdate事件会触发并将其更改回当前时间。为了使其正常工作,您可能需要引入一些额外的逻辑,例如在拖动滑块时暂停音频。

希望这有帮助!