С приближением нового года самое время создать счетчик нового года на JavaScript.

Сначала создайте папку YearEndCounter и три файла index.html, styles.css и main.js внутри нее. . Также открыл его в VS Code.

Теперь в index.html поместите базовый HTML-код, который обертывает время в класс countdown-container. У нас есть занятия четыре раза и на дни, часы, минуты и секунды. .

Мы также связали файлы main.js и styles.css и также начали проект на Live Server.

Перейдем к styles.css и поместим основные стили. Также обратите внимание, что мы также добавляем изображение снега в наш проект. С гибкостью у нас все по центру.

Теперь мы завершим стили, добавив CSS для контейнера обратного отсчета, и счетчик результатов находится в нужном месте.

Теперь пора преобразовать JavaScript и запустить наш счетчик. Итак, откройте main.js и добавьте приведенный ниже код. Здесь мы берем endTime как December 31 2020. Мы запускаем функцию updateCountdown () каждую секунду через setInterval ().

Внутри функции updateCountdown () мы просто вычисляем дни, часы, минуты и секунды.

На этом наш мини-проект завершен. Вы можете найти его код в моем аккаунте на github здесь.