單擊時逐漸關閉音頻

Question

我有一個自動播放的引擎歌曲，我希望當我單擊按鈕時聲音會“逐漸”關閉，以使音量逐漸減小，並最終達到音量的0.1或0.2，有人對嗎？ 這是我的實際代碼：

<audio autoplay>
   <source src="../audio/2445.mp3">
</audio>

<button>turn off</button>

Answer 1

不確定這樣做是否正確，可以執行以下操作：

<audio autoplay id='aud'>
   <source src='http://upload.wikimedia.org/wikipedia/commons/5/5b/Ludwig_van_Beethoven_-_Symphonie_5_c-moll_-_1._Allegro_con_brio.ogg'>
</audio>

<button id='btn'>turn off</button>

JS：

var audio = document.getElementById('aud'), interval;
document.getElementById('btn').onclick = turnOff;
function turnOff(){
    if(audio && !audio.paused){
        interval = setInterval(function(){
            console.log('audio volume: ', audio.volume);
            if(!audio || audio.paused || audio.volume < 0.1){
                clearInterval(interval);
            }else{
                audio.volume -= .05; // change this value as per your liking
            }
        }, 200); // change this value as per your liking
    }
}

我想更好的方法可能是使用web-audio 。

小提琴演示