создание и продвижение сайта (вбиваю в ТОП-10, как гвозди)Настройка и сопровождение платной рекламы яндекс.директ

Скрипт обратного отсчета времени CountDown

Скрипт: "Таймер обратного отсчета".

До наступления часа Х осталось … … …

Наверное Вы уже видели на разных сайтах обратный отсчет до наступления какого-то события. Например, " До окончания скидочной акции осталось ХХ : ХХ : ХХ ", соответственно, Вы видели вместо "ХХ : ХХ : ХХ" электронные часы, которые отсчитывают время в обратной последовательности. Я, например, такой скрипт использовал для отсчета времени до наступления 2022 года осталось ХХ дней, ХХ часов, ХХ минут.

После наступления часа Х, в данном случае 2022 года, обратный отсчет прекращается и выводится другая надпись, в данном случая я выводил: "С наступившим 2022 годом!"

В принципе какое событие наступит совсем не важно, скрипт можно настроить на абсолютно любую дату. По окончании обратного отсчета, в выводимой надписи тоже можно настроить абсолютно любой текст. Например, "С наступившим 2022 годом!"

Здесь настраиваются всего 2 параметра:

  1. дата отсчета;
  2. надпись, которая выводится по окончании отсчета (по наступлению даты).

Посмотрите, как работает скрипт.

Для подключения таймера обратного отсчета к своему сайту нужно отредактировать текстовую надпись в строке:

eventstr="С наступившим 2022 годом!";//Эта строка выводится по окончанию отсчета

Редактируйте то, что находится в кавычках "…" (в данном случае это текст "С наступившим Новым 2022 годом!"). Будьте внимательны, кавычки " " должны остаться!

Следующая строка:

ountdownid.innerHTML="До 2022 года осталось:<br>"+dday+ " " +ddaystr+", "+dhour+" "+dhourstr+", "+dmin+" "+dminstr+" и "+dsec+" "+dsecstr;

Здесь редактируется текстовая надпись, которая выводится перед таймером отсчета до наступления события Х. В данном случае "До 2022 года осталось". Будьте внимательны, кавычки " " должны остаться!

Последняя строка для редактирования:

CountDowndmn(2022,01,01);//Дата отсчета: год, месяц, число

Здесь нужно указать дату Х, до которой будет вестись обратный отсчет в формате: ГОД, МЕСЯЦ, ДЕНЬ.

Дальше редактируете те файлы сайта, на которых будет выводится таймер (будем считать, что это файл index.htm).

В нужном месте файла index.htm добавляется код:

<div align=center id=countdown></div>

<script>…</script>

1-я строчка даёт команду на вывод таймера, далее подключается скрипт.

Используя стили CSS, таймеру можно придать любой внешний вид.

Есть скрипт попроще

До 1.1.2038 г. осталось (дн., ч., мин., сек.):

Или вот так:

До 00:00:00 08.08.2088 осталось (дн., ч., мин., сек.):

Отвечу на любые вопросы. С уважением, Дмитрий Владимирович.

Ваше письмо×
Free Web Hosting