Как добавить таймер обратного отсчета

Я думаю, что вы уже неоднократно видели на многих сайтах таймеры обратного отсчета (countdown). Их активно применяют в тех случаях, если на сайте проходить какая-то акция или распродажа, либо если сайт закрыт на реконструкцию, то с помощью этого таймера, мы можем показать пользователю, сколько времени осталось до открытия. В общем, способов применения таймера обратного отсчета очень много.

В данном уроке, мы с вами поговорим о том, как такой таймер установить на свой сайт. Использовать мы будем скрипт CSS3 Countdown.

Смотреть видеоурок

Исходники данного таймера вы можете скачать кликнув по кнопке "Дополнительные материалы", либо на официальном сайте.

Понравилась статья?

Тогда оставь свой комментарий или расскажи о ней своим друзьям и коллегам.

Комментарии ВКонтакте

Добавить комментарийКомментариев (4)

Михаил 5 января 2015 г. в 23:19

Поддерживаю Дмитрия .

Ответить

Дмитрий Беглов 22 августа 2014 г. в 09:53

Александр, спасибо за интересный разбор.
А скажите, пожалуйста, можно ли сделать так, чтобы у этого таймера автоматически изменялись названия "Дней", "Часов", "Минут", "Секунд" в зависимости от значения, например, "1 День 3 Часа 2 Минуты 3 Секунды"?

Ответить

Александр Пауков 24 августа 2014 г. в 10:55

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

Ответить

Юрий 31 августа 2014 г. в 13:52

Александр Пауков, Было бы неплохо!)

Ответить
Наверх

Скачивание материалов доступно
только подписчикам!

Если вы подпишитесь, то сможете сразу же получить доступ ко всем материалам этого блога

Подписка бесплатная и займет у вас
не более 1 минуты

Получение доступа к материалам

Для получения доступа, заполните форму ниже. Введите свое настоящее имя и e-mail

« Вернуться назад

Проверьте свой почтовый ящик

и подтвердите подписку

После этого вы сразу же получите доступ ко всем материалам этого блога

Введите e-mail, который вы указывали при подписке

Мы проверим его по базе подписчиков и если вы на самом деле подписывались, то доступ для вас сново будет открыт

« Вернуться назад