jQuery.countdown — отсчёт времени до события

• 6133 просмотров

jQuery.countdown — отсчёт времени до события

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

Представляем Вашему вниманию самый простой и самый функциональный таймер обратного отсчёта – jQuery.countdown. Установить плагин очень просто, остаётся только разработать оформление используя CSS. 

Подключите библиотеку плагина jQuery.countdown после фреймворка jQuery:

<script src="путь_к_файлу/jquery.countdown.js"></script>

Вставьте данный HTML код туда, где вы хотите вывести таймер обратного отсчёта:

<div id="getting-started"></div>

Ну и самое главное, инициализация плагина. Добавьте данный JavaScript код перед закрывающим тегом body, но после подключенной ранее библиотеки плагина jquery.countdown.js:

$("#getting-started").countdown("2017/01/01", function(event) { $(this).text( event.strftime('%D days %H:%M:%S') );});
  • где 2017/01/01 – дата к которой таймер будет вести отсчёт
  •  %D days %H:%M:%S – формат вывода. В данному примере таймер будет работать в виде: (количество дней) days (часов):(минут):(секунд).

Примеры работы плагина доступны по ссылке.