[英]fadeOut() sound when Pause button is clicked
單擊暫停按鈕時如何使聲音淡出?
<script>
var sounds = [
"sounds/royksopp.mp3",
"sounds/9thwonder.mp3",
"sounds/thisbeat.mp3",
"sounds/mosdef.mp3",
"sounds/bewater.mp3",
"sounds/boutdre.mp3",
"sounds/masterflash.mp3",
"sounds/2ep.mp3",
"sounds/drewestcoast.mp3",
"sounds/poetry.mp3",
"sounds/mfdoom.mp3",
"sounds/oizo.mp3",
];
function StartOrStop(audioFile) {
srcAudio = sounds[Math.floor(Math.random() * sounds.length)];
var audie = document.getElementById("myAudio");
audie.addEventListener('ended', function() {
this.currentTime = 0;
this.play();
}, false);
if (audie.paused == false) {
audie.pause();
} else {
audie.src = srcAudio;
audie.play();
}
}
</script>
然后,我將其稱為:
<audio id="myAudio"></audio>
<button id="idj-play-button" onclick="StartOrStop()" class="btn btn-lg"><i class="glyphicon glyphicon-play"></i>
</button>
<button id="idj-pause-button" onclick="StartOrStop()" class="btn btn-lg hide"><i class="glyphicon glyphicon-refresh"></i>
</button>
我是否需要在If / Else語句audie.pause()
上進行某些更改? 我已經試過audie.animate({volume: 0}, 1000);
但這沒用。
謝謝。
audie.animate({volume: 0}, 1000);
僅當您使用jQuery時才能工作。
您可以進行如下更改:
if (audie.paused == false) {
let interval = setInterval(() => {
if (audie.volume == 0) {
audie.pause();
clearInterval(interval);
}
audie.volume -= 0.05;
}, 800);
}
嘗試這個:
<script>
var sounds = [
"sounds/royksopp.mp3",
"sounds/9thwonder.mp3",
"sounds/thisbeat.mp3",
"sounds/mosdef.mp3",
"sounds/bewater.mp3",
"sounds/boutdre.mp3",
"sounds/masterflash.mp3",
"sounds/2ep.mp3",
"sounds/drewestcoast.mp3",
"sounds/poetry.mp3",
"sounds/mfdoom.mp3",
"sounds/dreams.mp3",
"sounds/oizo.mp3", ];
function Start(audioFile) {
srcAudio = sounds[Math.floor(Math.random()*sounds.length)];
var audie = document.getElementById("myAudio");
audie.addEventListener('ended', function() {
this.currentTime = 0;
this.play();
}, false);
$(audie).animate({volume: 0.9}, 0);
audie.src = srcAudio;
audie.play();
}
function Stop(audioFile) {
var audie = document.getElementById("myAudio");
$(audie).animate({volume: 0}, 400);
}
</script>
HTML:
<audio id="myAudio"></audio>
<button id="idj-play-button" onclick="Start()" class="btn btn-lg"><i class="glyphicon glyphicon-play"></i>
</button>
<button id="idj-pause-button" onclick="Stop()" class="btn btn-lg hide"><i class="glyphicon glyphicon-refresh"></i>
</button>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.