Skip to content

Instantly share code, notes, and snippets.

@alirezas
Created February 13, 2017 10:54
Show Gist options
  • Save alirezas/c4f9f43e9fe1abba9a4824dd6fc60a55 to your computer and use it in GitHub Desktop.
Save alirezas/c4f9f43e9fe1abba9a4824dd6fc60a55 to your computer and use it in GitHub Desktop.
fadeIn & fadeOut in vanilla js
function fadeOut(el){
el.style.opacity = 1;
(function fade() {
if ((el.style.opacity -= .1) < 0) {
el.style.display = "none";
} else {
requestAnimationFrame(fade);
}
})();
};
function fadeIn(el, display){
el.style.opacity = 0;
el.style.display = display || "block";
(function fade() {
var val = parseFloat(el.style.opacity);
if (!((val += .1) > 1)) {
el.style.opacity = val;
requestAnimationFrame(fade);
}
})();
};
@sajermann
Copy link

Thanks.

@Hildt
Copy link

Hildt commented Feb 19, 2020

Thanks!

@tunapotur
Copy link

Those functions are great. But i need promisified versions.How could you return promise from those functions?

@Kyborg01
Copy link

Thanks!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment