Список бесплатных таймеров обратного отсчета на jquery/css3
 

Список бесплатных таймеров обратного отсчета на jquery/css3

9 февраля 2014 4:43 Категории: Кухня

Совсем недавно мне понадобился таймер обратного отсчета для продающей страницы, поэтому я решил поделиться сайтами, которые мне пригодились.

Все очень просто, я уже писал о том, как начал верстать landing page по продаже платьев. На странице должен был размещен таймер обратного отсчета для акции, по всем правилам Бизнес молодости. И мне крайне не хотелось писать самому все скрипты для таймера, вырисовывать перелистывание цифры и прочие вещи, которые были уже давно реализованы до меня.

Именно поэтому предлагаю вашему вниманию список сайтов, которые предлагают свои js библиотеки для создания таймера обратного отсчета на сайте:

Free jQuery Count Down Plugin: County

Бесплатный jQuery плагин для отсчета времени

Бесплатный jQuery плагин для отсчета времени

Бесплатный jQuery плагин для отсчета времени

Довольно красивый и интересный получается таймер обратного отсчета. Предлагается даже на выбор несколько цветовых решений:

  • красный;
  • черный;
  • синий;
  • серый, очень близкий к белому.

Демо пример можно увидеть здесь, а подробное описание настройки и установки можно прочитать тут.

TimeTo — jQuery Plugin

JQuery плагин — таймер обратного отсчета цифровые часы

jQuery plugin - timer countdown digital clock

jQuery plugin — timer countdown digital clock

Этот таймер оказался очень легким в установке на сайт. Подробную информацию можно почитать отсюда. А я приведу маленький пример того, как можно использовать таймер:

  1. Скачать и прикрепить к странице библиотеку javascript Timedo
  2. В нужном месте, где должен отобразиться таймер, создать блок с id=»countdown-timer»
  3. Вызвать библиотечную функцию и указать id созданного блока

Все оказалось очень даже просто, как я и говорил.

CSS3 Countdown.Flip style countdown timer

CSS3 таймер обратного отсчета. Таймер с эффектом перелистывания.

Как сделать обратный отсчет на сайте

Как сделать обратный отсчет на сайте

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

 jQuery Countdown Timer

Урок, где подробно описывается создание таймера на JQuery для landing page с обратным отсчетом.

Красивый таймер обратного отсчета с эффектом перелистывания

Красивый таймер обратного отсчета с эффектом перелистывания

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

В завершение статьи предлагаю просмотреть видео урок от webtheory про формы в html.

  • Илья

    Я бы еще сюда добавил примеры онлайн сервисов. Не всем захочется ковырятся в коде, не все его понимают. Кому то легче наглядно настроить вид таймера и поставить оный себе на сайт) Я уже давно взял за привычку пользоваться такими сервисами. Экономит много времени и нервов. Для примера могу сослаться на ресурс, которым сам всегда пользуюсь — e-timer.ru