Howler.js - 当声音消失或音量改变时触发事件答案

【问题标题】：Howler.js - Fire events when sound finishes fading or volume has changedHowler.js - 当声音消失或音量改变时触发事件
【发布时间】：2018-01-31 18:40:59
【问题描述】：

如何在声音淡出完成时自动触发事件 sound.stop()（淡出目标音量 = 0.3），并且在音量为 0.6 时立即显示警报弹出窗口？

<!DOCTYPE html>
<script src="https://rawgit.com/goldfire/howler.js/master/src/howler.core.js"></script>
<button onclick="Play()">Play</button>
<button onclick="StartFade()">Fade</button>

<script>
var sound = new Howl({
src: ['https://howlerjs.com/assets/howler.js/examples/player/audio/rave_digger.webm']});

function Play() sound.play();
function StartFade() sound.fade(1, 0.3, 2000);
</script>

【问题讨论】：

标签： javascript howler.js

【解决方案1】：

.fade() 方法在完成时会触发“fade”事件。您可以将侦听器附加到声音对象

sound.on('fade', function(){
  console.log('#Faded!!');
});

或者，您可以在创建新的 Howl 时设置 onFade() 方法。

var sound = new Howl({
  src: ['https://howlerjs.com/assets/howler.js/examples/player/audio/rave_digger.webm'],
  onFade: function(){
    //stuff goes here!
  }

});

为了在音量达到 0.6 时显示警报，您可以链接回调，因此第一个淡入淡出方法实际上只是从 1 到 0.6，然后在事件侦听器中弹出警报，然后从 0.6 到0.3

使用 onFade() 和 onVolume() 方法，您也可以这样写，尽管它会在音量设置为 0.6 时发出此警报，无论是否渐变。

onVolume: function(){
  if (this.volume == 0.6)
    alert("Volume is currently 0.6!");
}

【讨论】：

谢谢。 onfade() 和 onvolume() 函数呢？它们仍然是有效的函数吗？
是的！我忘记了那些。将其添加到我的答案中。