РЕПЕТИТОР математика физика информатика
Для школьников и студентов. Подтягивание пробелов. ЦЭ, ЦТ, ОГЭ, ЕГЭ.
Идет набор на ЛЕТО. Жмите для подробностей:)
65 of 125 menu

Таймер до ДР

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

Основные возможности проекта

  • Форма для ввода даты рождения.
  • Сохранение даты в localStorage.
  • Обратный отсчет дней, часов и минут до дня рождения.
  • Поздравление в день рождения.
  • Возможность редактировать дату.

Установка даты рождения

При первом заходе на сайт появляется форма с полем для ввода даты рождения (инпут date) и кнопкой "Сохранить". После сохранения дата записывается в localStorage и начинается обратный отсчет.

Таймер

Таймер ведет обратный отсчет до дня рождения. Отображаются:

  • Дни.
  • Часы.
  • Минуты.

Отсчет обновляется в реальном времени (каждую секунду).

Поздравление

Когда наступает день рождения (текущая дата совпадает с днем рождения), таймер останавливается и сайт показывает поздравление с картинкой и текстом.

Редактирование даты

На странице должна быть кнопка "Изменить дату". При нажатии на нее открывается форма с текущей датой рождения, которую можно изменить и сохранить. Таймер сбрасывается и запускается заново.

Хранение данных

Дата рождения пользователя сохраняется в локальном хранилище браузера (localStorage). При перезагрузке страницы дата загружается из хранилища и таймер продолжает работу.

Дополнительные возможности

  • Тематическое оформление в день рождения (конфетти, салют).
  • Звуковое поздравление в день рождения.
Мы используем cookie для работы сайта, аналитики и персонализации. Обработка данных происходит согласно Политике конфиденциальности.
принять все настроить отклонить