如何创建一个JavaScript函数,在鼠标移出时淡出音频?

时间:2019-02-12 13:12:07

标签: javascript audio fadeout onmouseout

我有一个非常简单的javascript,它会在图像的鼠标悬停时开始播放音频,并在鼠标悬停时停止播放音频。

如何更改第二个功能,使其逐渐淡出声音,而不是突然停止呢?

我看过其他类似的问题,但不幸的是我仍然被困住了。

<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>

它原样有效,但是添加淡出元素会很好。我知道这是将音量设置为随着时间的推移而减小,但是我不确定这样做的正确方法。

1 个答案:

答案 0 :(得分:0)

您尝试使用setInterval()并将thissound.volume减为0,然后是pause()吗?

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