howler.js更新声音的音量

时间:2016-05-29 00:45:25

标签: javascript audio howler.js

我正在使用

  

howler.js 2.0

但似乎无法获得更新音量工作的简单示例。这里有一些示例代码:

window.sound = new Howl({
 src:'http://example.com/assets/audio/background.mp3',
  loop: true,
  volume: 0.15
});

window.updateVolume = function(value) {
  alert('before update volume:', window.sound.volume());
  sound.volume = value;
  alert('after update volume:', window.sound.volume());
}

我已尝试使用volume() functionvolume属性。似乎没有用。

JsFiddle:https://jsfiddle.net/umx2bdm8/

我错过了什么?此外,我注意到如果您多次单击play,则会开始播放相同声音的多个实例。我不希望这样,并且在特定play实例上点击howl应始终使用该实例。

1 个答案:

答案 0 :(得分:1)

如果查看howler.js’s docs for volume,则表明volume是一个函数,而不是一个可赋值的属性,并且您需要将新卷作为参数传入以设置卷。因此,您需要sound.volume(value)代替sound.volume = value

sound = new Howl({
  src: 'http://test.menstrupedia.com/assets/audio/background.mp3',
  loop: true,
  volume: 0.5
});

updateVolume = function(value) {
  console.log('before update volume:', sound.volume());
  sound.volume(value);
  console.log('after update volume:', sound.volume());
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/howler/2.0.0-beta13/howler.min.js"></script>


<button onclick="sound.play()">
  Play
</button>
<button onclick="updateVolume(0.15)">
  Change volume to 0.15
</button>

(为了演示目的,我将音量值切换到上面,因此听众无需担心音乐在点击按钮时是否会突然震耳欲聋。)