javascript - 使用 Rangeslider.js 实现 HTML5 音频时间清理器

标签 javascript jquery html audio slider

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

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

最佳答案

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

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

但是,当您尝试在播放时更改时间时,会出现一些奇怪的情况 - 有时它会恢复到原来的位置。我相信这是某种竞争条件,因为当您滑动轨道时,timeupdate 事件将触发并将其更改回当前时间。为了使其正常工作,您可能需要引入一些额外的逻辑,例如在拖动 slider 时暂停音频。

希望这有帮助!

关于javascript - 使用 Rangeslider.js 实现 HTML5 音频时间清理器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30374409/

相关文章:

javascript - jquery 无法识别表单输入字段

javascript - GitHub 使用什么 JavaScript 语法高亮器?

jquery fadein 无法在 IE8 上运行

html - 使用 Bootstrap 将侧边栏拆分为围绕主要内容的顶部和底部

javascript - jquery simplecontextmenu 插件的扩展功能

javascript:从范围内生成 2 个随机但不同的数字

javascript - 将 Jquery 转换为 Motools

jquery - 自动添加文本的最佳 jQuery 方法

javascript - 带复选框过滤的 d3 map

javascript - 无法使用 d3.js 显示 JSON 映射