Скрипт времени / Скрипты / Сниппеты Bootstrap

Версия: v1.0.1

Каталог: Сниппеты Bootstrap

Категория: Скрипты

Bootstrap: 3, 4, 5

Для CMS: HTML, Drupal, Joomla, uCoz, WordPress, Magento, OpenCart, PrestaShop, Shopify, WHMCS

Язык: Русский

Вес файла: 0.8 Kb

Уникальный ID: 1546

Количество символов:

Посмотрели: 3054 раз

Помощь: установка & настройка

Прикреплён файл №2: /stuff/0-0-0-1546-20

Скачали бесплатно: 14 раз

Прокомментировали: 0 раз

Рейтинг: 5.0 / 5 - 3 голосов

Тип лицензии: CC BY 4.0

Авторство: Посмотреть

Информация: Пользователям

Информация: Правообладателям

Теги: date timer, Таймер, Bootstrap, обратный отсчёт, Script, Скрипт, timer, таймер отсчёта, время, скрипт времени, время скрипт

Поделился: BootstrapТема

Добавлено: 2016-12-14 в 19:37

Метка: 1647798011

⇄ ⇅

<h1 class="text-center">СКРИПТ ВРЕМЕНИ</h1>

</div>
</div>
</div>

days = parseInt(seconds_left / 86400);
 seconds_left = seconds_left % 86400;
 
 hours = parseInt(seconds_left / 3600);
 seconds_left = seconds_left % 3600;
 
 minutes = parseInt(seconds_left / 60);
 seconds = parseInt(seconds_left % 60);

countdown.innerHTML = '<h3 class="days col-sm-3 text-center well">' + days + ' <b>Дней</b></h3> <h3 class="hours col-sm-3 text-center well">' + hours + ' <b>Часов</b></h3> <h3 class="minutes col-sm-3 text-center well">' + minutes + ' <b>Минут</b></h3> <h3 class="seconds col-sm-3 text-center well">' + seconds + ' <b>Секунд</b></h3>'; 
}, 1000);
</script>

<pre><code>
&lt;script&gt;
// Отсчёт времени до даты
var target_date = new Date('June, 31, 2017').getTime();

// Утилиты времени
var days, hours, minutes, seconds;
 
// Идентификатор контейнера
var countdown = document.getElementById('countdown');
 
// Обновить тег с идентификатором "countdown" раз в 1 секунду
setInterval(function () {
 
 // Найти количество "секунд" между сейчас и датой
 var current_date = new Date().getTime();
 var seconds_left = (target_date - current_date) / 1000;
 
 // Сделать расчеты времени
 days = parseInt(seconds_left / 86400);
 seconds_left = seconds_left % 86400;
 
 hours = parseInt(seconds_left / 3600);
 seconds_left = seconds_left % 3600;
 
 minutes = parseInt(seconds_left / 60);
 seconds = parseInt(seconds_left % 60);
 
 // Формат строки обратный отсчет + установить значение тегов
 countdown.innerHTML = '&lt;h3 class="days col-sm-3 text-center well"&gt;' + days + ' &lt;b&gt;Дней&lt;/b&gt;&lt;/h3&gt; &lt;h3 class="hours col-sm-3 text-center well"&gt;' + hours + ' &lt;b&gt;Часов&lt;/b&gt;&lt;/h3&gt; &lt;h3 class="minutes col-sm-3 text-center well"&gt;' + minutes + ' &lt;b&gt;Минут&lt;/b&gt;&lt;/h3&gt; &lt;h3 class="seconds col-sm-3 text-center well"&gt;' + seconds + ' &lt;b&gt;Секунд&lt;/b&gt;&lt;/h3&gt;'; 
 
}, 1000);
&lt;/script&gt;

</code></pre>

<blockquote>
Классы адаптивности и стилевого оформления имеют актуальность при использовании подключенного плагина Bootstrap.
</blockquote>

</div>
</div>
</div>

BootstrapTema

Скрипт времени

Скриншот

Подробнее

Похожие материалы

Просмотренные материалы

Всего комментариев: 0