Simular el efecto FadeOut de jQuery usando solo Vanilla JS. La siguiente función javascript fadeOut() consta de 2 parámetros: elemento y duración (este ultimo opcional) para controlar el tiempo que quermeos que dure la animación.
function fadeOut(element, duration = 600) { element.style.display = ''; element.style.opacity = 1; var last = +new Date(); var tick = function() { element.style.opacity = Number(+element.style.opacity - (new Date() - last) / duration).toFixed(4); last = +new Date(); if (-element.style.opacity <= 0) { (window.requestAnimationFrame && requestAnimationFrame(tick)) || setTimeout(tick, 16); } }; tick(); }
Demo:
Y para el efecto contrario puedes ver: https://www.bufa.es/vanilla-js-fadein/
Agradezco tu comentario 🤘