When you exactly know how animation works in JavaScript

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13

let header = document.querySelector('.header');
let elem = document.querySelector('.elem');

setTimeout(() => elem.style.display = 'block', 7500);
setTimeout(() => elem.style.opacity = '0.2', 7700);
setTimeout(() => elem.style.opacity = '0.3', 7800);
setTimeout(() => elem.style.opacity = '0.4', 7900);
setTimeout(() => elem.style.opacity = '0.5', 8000);
setTimeout(() => elem.style.opacity = '0.6', 8100);
setTimeout(() => elem.style.opacity = '0.7', 8200);
setTimeout(() => elem.style.opacity = '0.8', 8300);
setTimeout(() => elem.style.opacity = '0.9', 8400);
setTimeout(() => elem.style.opacity = '1', 8500);