如何创建一个在mouseout上淡出音频的javascript函数？

Question

我有一个非常简单的javascript，可以在鼠标悬停图像时启动音频播放，并在mouseout上停止音频播放。

如何更改第二个功能，使声音逐渐消失，而不是突然停止？

我看过其他类似的问题，但遗憾的是我仍然陷入困境。

<img onmouseover="PlaySound('mySound')"
    onmouseout="StopSound('mySound')"
    src="tictactoe.png">

<audio id='mySound' src='audio.mp3'/>

<script>
    function PlaySound(soundobj) {
        var thissound=document.getElementById(soundobj);
        thissound.play();
    }

    function StopSound(soundobj) {
        var thissound=document.getElementById(soundobj);
        thissound.pause();
        thissound.currentTime = 0;
    }
</script>

它可以有效地工作，但添加淡出元素会很好。我知道这是关于将音量设置为随时间减小但我不确定正确的方法。

Answer 1

你尝试使用setInterval()并将thissound.volume减少到0然后pause()？

也许增加声音的开始也是一件好事