我目前正在制作一個影片,其中每個圖示在淡出時都有延遲。淡出影片效果很好,但只在第一個圖示上,我不確定為什么會這樣。有人可以指出我犯的錯誤嗎?
Javascript代碼:
function closeHorizontalWindow()
{
const delay = 150;
const reasons = ['btnReady', 'btnNotReady', 'btnBreak', 'btnEmail', 'btnLunch',
'btnComfortBreak', 'btnMeeting', 'btnChat']
for (let i = 0; i < reasons.length; i ) {
document.getElementById(reasons[i]).style.animation = `reasonsfadeout 0.45s ease-out
forwards ${delay}ms`
delay =150
}
CSS 代碼:
@keyframes reasonsfadeout
{
from{opacity: 1; }
to {opacity: 0; }
}
}
謝謝
uj5u.com熱心網友回復:
您可以使用間隔來迭代而不是常規的 for 回圈。
function closeHorizontalWindow()
{
const delay = 150;
const reasons = ['btnReady', 'btnNotReady', 'btnBreak', 'btnEmail', 'btnLunch',
'btnComfortBreak', 'btnMeeting', 'btnChat']
let i = 0;
const interval = setInterval(function(){
document.getElementById(reasons[i]).style.animation = `reasonsfadeout 0.45s ease-out forwards ${delay}ms`;
i ;
if(i>=reasons.length){
clearInterval(interval);
}
}, delay);
}
轉載請註明出處,本文鏈接:https://www.uj5u.com/qukuanlian/419394.html
標籤:
