Vue js fadein effect> 你可以通过 js fadein (使用 vue.js) 制作这段代码吗？

Question

let fadeTarget = document.getElementById("detail-poster")
let faedEffect = setInterval(function () {
if (!fadeTarget.style.opacity) {
fadeTarget.style.opacity = 1
}
if (fadeTarget.style.opacity > 0) {
fadeTarget.style.opacity -= 0.1
} else {
clearInterval(faedEffect)
}
this.num = (this.num + 1) % this.backDropImage?.backdrops.length
}, 200)
}

我发现香草js淡出效果，但没有淡出效果有人知道怎么用香草js让淡出生效吗??

Answer 1

你基本上做了与你上面的淡出相反的事情，但是你从零开始，增加(而不是减少)不透明度，直到它等于1。

let fadeTarget = document.getElementById("detail-poster")
let fadeEffect = setInterval(function () {
if (!fadeTarget.style.opacity) {
fadeTarget.style.opacity = 0
}
if (fadeTarget.style.opacity < 1) {
fadeTarget.style.opacity += 0.1
} else {
clearInterval(fadeEffect)
}
}, 200)