Как изменить громкость звука в зависимости от скорости курсора и сделать его плавным

Question

Итак, я хочу изменить громкость аудиоэлемента в зависимости от скорости перемещения курсора. Когда вы двигаетесь быстро, он становится громче, но когда вы двигаетесь медленно, он становится тише.

Но это не гладко, вы можете четко слышать изменения громкости. Мне нужно это гладко, как JQuery объем анимации: $("#audio").animate({volume: 1}, someAmountOfTime);

Для измерения скорости курсора я использую Курсометр .

Я создал jsfiddle , где вы можете услышать, как меняется громкость. Вы должны нажать run несколько раз или только один раз, потому что он не будет играть сам по себе.

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;
      }
    }
  }
});