javascript - 如何使用 howler js 更新进度条？

Question

如何使用 howler js 并在播放音频时更新进度条？

我假设我使用了 pos 或 seek 但是我似乎无法让它工作。

我可以创建一个 on 事件监听器以在每次位置更改时更改吗？

进度条 HTML:

<progress id="progress_bar" value="0.0" max="1.0" style="-webkit-appearance: none; appearance: none; height: 48px; float: left;"></progress>

咆哮 js:

on ('update_progress', function() {
    document.getElementById('progress_bar').value = audio.pos();
}),

然后如果按下进度条，我该如何更新音频的位置。我认为在那种情况下使用输入范围实际上可能会更好。

Answer 1

目前 howler.js 中没有进度事件，但可能会在以后添加。但是，您可以随时(在 2.0 上)调用 audio.seek() 或在 1.0 上调用 audio.pos() 来获取当前位置。然后您可以在 requestAnimationFrame 中调用它(这是 2.0 演示使用的)或 setInterval 来更新您的进度条。