/
githubmirror
/
50projects50days
Обзор
Документация
Войти
/
githubmirror
/
50projects50days
Код
Запросы
0
Пакеты
0
Релизы
0
Аналитика
Безопасность
master
animated-countdown/script.js
40 строк
1011 B
Brad Traversy
Animated countdown
06 сен 2020, 16:23
06 сен 2020, 16:23
c94e46a
Код
Авторство
О чём код?
const nums = document.querySelectorAll('.nums span') const counter = document.querySelector('.counter') const finalMessage = document.querySelector('.final') const replay = document.querySelector('#replay') runAnimation() function resetDOM() { counter.classList.remove('hide') finalMessage.classList.remove('show') nums.forEach((num) => { num.classList.value = '' }) nums[0].classList.add('in') } function runAnimation() { nums.forEach((num, idx) => { const nextToLast = nums.length - 1 num.addEventListener('animationend', (e) => { if (e.animationName === 'goIn' && idx !== nextToLast) { num.classList.remove('in') num.classList.add('out') } else if (e.animationName === 'goOut' && num.nextElementSibling) { num.nextElementSibling.classList.add('in') } else { counter.classList.add('hide') finalMessage.classList.add('show') } }) }) } replay.addEventListener('click', () => { resetDOM() runAnimation() })