gpt4 book ai didi

javascript - JavaScript音频淡出

转载 作者:行者123 更新时间:2023-12-03 01:52:51 25 4
gpt4 key购买 nike

当我按下键盘上的“向上箭头”按钮时,我希望音频消失并停止。它似乎逐渐消失,但是再次出现并且永不停止。

music.html:48 Uncaught IndexSizeError:无法在'HTMLMediaElement'上设置'volume'属性:提供的音量(-0.1)超出范围[0,1]。

我是Java语言的初学者。

这是我的代码。

HTML

    <body>

<input type="text" size="3" value="1" id="numtext" style="font-size:500px" >

<audio id=1>
<source src=BGM/a.mp3>
</audio>

<audio id=2>
<source src=BGM/b.mp3>
</audio>

<audio id=3>
<source src=BGM/c.mp3>
</audio>

</body>

Javascript
    <script language="JavaScript">

var interval
var timeout

document.onkeydown = function() {

if(event.keyCode == 38){
var x = document.getElementById('numtext').value;
var sounds = document.getElementById(x);

interval = setInterval(fade, 200);

return;

}
}

function fade() {

var x = document.getElementById('numtext').value;
var sounds = document.getElementById(x);
sounds.volume = sounds.volume - 0.1;

var timer = setTimeout(function() {

window.clearInterval(interval);
for(i=0; i<sounds.length; i++) sounds[i].pause();
for(i=0; i<sounds.length; i++) sounds[i].currentTime = 0;

}, 2000);

timeout = setTimeout(stopFade, 2000);

}

function stopFade() {
var x = document.getElementById('numtext').value;
var sounds = document.getElementById(x);

for(i=0; i<sounds.length; i++) sounds[i].pause();
for(i=0; i<sounds.length; i++) sounds[i].currentTime = 0;
sounds.volume = 1;

}

</script>

有什么建议吗?

最佳答案

您的淡入淡出功能需要检查其分配的音量是否在0到1之间。由于只调低了音量,因此可以检查它是否大于0。

var interval
var timeout

document.onkeydown = function() {

if(event.keyCode == 38){
interval = setInterval(fade, 200);
}

}

function fade() {

var x = document.getElementById('numtext').value;
var sounds = document.getElementById(x);

var newVolume = sounds.volume - 0.1;

// Check if the newVolume is greater than zero
if(newVolume >= 0){
sounds.volume = newVolume;
}
else{
// Stop fade
clearInterval(interval);
sounds.volume = 0;
sounds.pause();
sounds.currentTIme = 0;
}

}

我在这里剪掉了不必要的代码。

关于javascript - JavaScript音频淡出,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38207521/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com