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)
}
i find vanilla js fade out effect but there is no fade in effect anybody know how make fade in effect with vanilla js??
You basically do the opposite of the fade out that you have above, but you start at zero and increment (instead of decrement) the opacity until it equals 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)