Использование JQuery Countdown Timer phpbb3
Добавлено: 20 июл 2013, 10:51
Всем доброго времени суток Сегодня хотелось бы поговорить о достаточно полезном плагине JQuery Countdown Timer, который реализует красивый таймер обратного отсчета до выбранной даты. К слову данный плагин (или очень схожий) используется в свежем анонсе модификации
Как я и говорил, внешний вид плагина весьма презентабелен, оценитеoverall_header.html и перед </head> вставляем
Обратите внимание на данную строку
Если у вас уже подключен jquery такой же или выше версии, то убираем строку эту, если подключен jquery ниже версии - то убираем это подключение ибо будут конфликты.
В то место, где хотите видеть сам таймер нужно вставить
Настройка даты осуществляется в скрипте assets/js/script.js , конкретно в части
Первое число - год, второе - месяц, третье - число. Помните то, что счет месяцев в скрипте начинается с 0, а не с 1 как принято в календарях, тобишь если нужен отсчет до июля (который 7-ой по счету месяц) вам нужно прописывать 6-ку, а не 7-ку. Надеюсь логика ясна.
Так же из этого скрипта можно удалить эту часть
Который отвечает за надпись под счетчиком, непонятно для чего она вообще нужна, вообщем дело ваше.
На этом впринципе и все, успехов
Как я и говорил, внешний вид плагина весьма презентабелен, оцените
Настройка и подключение достаточно легки для каждого, для начала качаем архив с плагином
Для удобства, единственную папку из архива помещаем в корень форума, после этого открываем шаблон
Код: Выделить всё
<link rel="stylesheet" href="assets/countdown/jquery.countdown.css" />
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script src="assets/countdown/jquery.countdown.js"></script>
<script src="assets/js/script.js"></script>
Код: Выделить всё
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
В то место, где хотите видеть сам таймер нужно вставить
Код: Выделить всё
<div id="countdown"></div>
<p id="note"></p>
Код: Выделить всё
ts = new Date(2012, 0, 1),
Так же из этого скрипта можно удалить эту часть
Код: Выделить всё
if(newYear){
message += "left until the new year!";
}
else {
message += "left to 10 days from now!";
}
На этом впринципе и все, успехов