Разработка сайтов

Скрипт для добавления таймеров Tilda

Тильда
Скрипт для добавления таймеров на вашем сайте может быть очень полезным для создания чувства срочности и привлечения внимания посетителей. В данной статье мы рассмотрим, как добавить таймеры на ваш сайт с помощью скрипта для Тильды.

Шаг 1: Создайте элемент для таймера Первым шагом является создание элемента, в котором будет отображаться таймер. Вы можете создать новый блок на странице и задать ему имя. Например, "Таймер". Затем добавьте в этот блок текстовый элемент, который будет отображать оставшееся время.

Шаг 2: Добавьте скрипт на страницу Следующим шагом является добавление скрипта на страницу. Для этого перейдите в "Редактирование HTML/CSS" и вставьте следующий код:
<script>
function countdown(dateEnd) {
  var timer, days, hours, minutes, seconds;
  dateEnd = new Date(dateEnd);
  dateEnd = dateEnd.getTime();
  if (isNaN(dateEnd)) {
    return;
  }
  timer = setInterval(calculate, 1000);
  function calculate() {
    var dateStart = new Date();
    var dateStart = new Date(dateStart.getUTCFullYear(),
                             dateStart.getUTCMonth(),
                             dateStart.getUTCDate(),
                             dateStart.getUTCHours(),
                             dateStart.getUTCMinutes(),
                             dateStart.getUTCSeconds());
    var timeRemaining = parseInt((dateEnd - dateStart.getTime()) / 1000)
    if (timeRemaining >= 0) {
      days    = parseInt(timeRemaining / 86400);
      timeRemaining   = (timeRemaining % 86400);
      hours   = parseInt(timeRemaining / 3600);
      timeRemaining   = (timeRemaining % 3600);
      minutes = parseInt(timeRemaining / 60);
      timeRemaining   = (timeRemaining % 60);
      seconds = parseInt(timeRemaining);
      document.getElementById("days").innerHTML    = parseInt(days, 10);
      document.getElementById("hours").innerHTML   = ("0" + hours).slice(-2);
      document.getElementById("minutes").innerHTML = ("0" + minutes).slice(-2);
      document.getElementById("seconds").innerHTML = ("0" + seconds).slice(-2);
    } else {
      return;
    }
  }
  function display(days, hours, minutes, seconds) {}
}
countdown('07/01/2023 03:00:00 AM'); // задайте дату и время окончания таймера
</script>
Шаг 3: Измените код скрипта Вам необходимо изменить код скрипта, чтобы он отображал таймер в элементе, который вы создали в шаге 1. Для этого замените document.getElementById("days").innerHTML и другие элементы на соответствующие элементы вашего блока. Например, если вы назвали свой блок "Таймер", то замените document.getElementById("days").innerHTML на document.getElementById("timer-days").innerHTML, где "timer-days" - это ID элемента
Made on
Tilda