Таймер обратного отсчета для сайта. E-timer.

Поднимаю достаточно старую заметку про то, как разместить таймер обратного отсчета на сайт. В то время я пользовался скриптом E-timer.

E-timer - это бесплатный таймер обратного отсчета для сайта. Работать с ним очень просто, все настройки доступны и интуитивно понятны, поэтому разобраться с ним сможет даже человек у которого нет специальных знаний по html, css и javascript. Рассмотрим по шагам настройку таймер обратного отсчета.

Настройка основных параметров для таймера обратного отсчета e timer:

В основных настройках присутствуют:

1. Возможность подключения библиотеки jQuery, на основе которой и работает таймер, обычно библиотека уже подключена на сайте и подключать её не требуется;
2. Возможность настройки перезапуска таймера (не перезапускать, перезапускать каждый день, каждую неделю или каждый месяц);
3. Возможность указать дату с точностью до минут, когда закончится отсчет;
4. Возможность размещения в таймере своего заголовка;

Настройки отображения таймера и цифр интуитивно понятны, поигравшись с этими настройками, вы получите стилизованный под ваш сайт таймер обратного отсчета.

Пример js кода, который нужно разместить, чтобы увидеть таймер обратного отсчета на странице сайта:

<script src="https://e-timer.ru/js/etimer.js"></script>
<script type="text/javascript">
	jQuery(document).ready(function() {
		jQuery(".eTimer").eTimer({
			etType: 0, etDate: "26.09.2018.8.10", etTitleText: "До окончания акции осталось:", etTitleSize: 20, etShowSign: 1, etSep: ":", etFontFamily: "Trebuchet MS", etTextColor: "#a3a3a3", etPaddingTB: 15, etPaddingLR: 15, etBackground: "#333333", etBorderSize: 0, etBorderRadius: 2, etBorderColor: "white", etShadow: " 0px 0px 10px 0px #333333", etLastUnit: 4, etNumberFontFamily: "Impact", etNumberSize: 35, etNumberColor: "white", etNumberPaddingTB: 0, etNumberPaddingLR: 8, etNumberBackground: "#11abb0", etNumberBorderSize: 0, etNumberBorderRadius: 5, etNumberBorderColor: "white", etNumberShadow: "inset 0px 0px 10px 0px rgba(0, 0, 0, 0.5)"
		});
	});
</script>

HTML код таймера обратного отсчета на сайт:

     <div class="eTimer"></div>

Скопировать этот код можно после настройки в соответствующем окне или с моего сайта, здесь настройки указаны по умолчанию, такие же как у e timer.

Теперь мы узнали как можно разместить таймер обратного отсчета на сайт, на основе таймера e timer. Всем удачи и успехов в работе!