javascript - 如何根据光标速度更改音量并使其流畅

Question

所以我想根据光标移动速度改变音频元素的音量。当你快速移动时，它会变得更响，但当你移动缓慢时，它会变得更安静。

但它并不流畅，你可以清楚地听到音量的变化。我需要它像 jquery volume animate 一样平滑：$("#audio").animate({volume: 1}, someAmountOfTime);

为了测量光标速度，我使用cursometer。

我创建了jsfiddle，您可以在其中听到音量的变化。您必须单击运行几次或一次，因为它不会自行播放。

HTML：

<audio id="audio" src="https://jirihulmak.cz/samples/beep.mp3" autoplay="autoplay"></audio>

jQuery：

$(window.document).cursometer({
    onUpdateSpeed: function(speed) {

    var currSpeed = parseInt(speed*1000) / 10000;

    if (currSpeed >= 1) { // prevent volume more than 1 (causing error)
      $('#audio')[0].volume = 1;

    } else {
      if (currSpeed < 0.1) { // I don't need it completely quiet
        $('#audio')[0].volume = 0.1;

      } else {
        $('#audio')[0].volume = currSpeed;
      }
    }
  }
});

标签： javascriptjqueryhtmlaudio