@Otrivin
junior full-stack сисадмин

Как создать таймер обратного отсчёта на несколько дней вперед?

Здравствуйте!

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

Изначально предполагалось, что событие ожидается ежедневно, и я реализовал это так:

// подсчёт нужно производить с учётом часовых поясов,
// поэтому все временные метки приводим к UTC
(function($){
	// текущее время
    var date_now = new Date();

    // время наступления события по UTC
    var target_utc = Date.UTC(date_now.getUTCFullYear(), date_now.getUTCMonth(), date_now.getUTCDate(), 17, 00, 00);

    // получаем миллисекунды в UTC для расчета
    var now_utc = date_now.getTime();
    
    // Если сегодня это событие уже прошло, прибавляем день
    if (now_utc >= target_utc){
    	var day = date_now.getUTCDate() + 1;
    	target_utc = Date.UTC(date_now.getUTCFullYear(), date_now.getUTCMonth(), day, 17, 00, 00);
    }

    // считаем оставшиеся секунды до события
    var diff = Math.floor((target_utc - now_utc)/1000);

    // Запускаем таймер, передаем в него оставшиеся секунды
    var clock = $('.flipclock').FlipClock({
        autoStart: false,
        clockFace: 'DailyCounter',
        language: 'ru',
        countdown: true
    });
    clock.setTime(diff);
    clock.setCountdown(true);
    clock.start();
})(jQuery);


Вопрос: как я могу изменить скрипт, чтобы вычислять разницу в один день? Т.е. ожидается, что событие будет выполняться 16, 18, 20 числа и т.д.
  • Вопрос задан
  • 1293 просмотра
Решения вопроса 1
GreyCrew
@GreyCrew
Full-stack developer
Тильда, тильдой, а moment все же помогает в таких делах
let a = moment("2018-03-10", "YYYY-MM-DD"); // 1я дата (1й аргумент строковая дата, 2й аргумент формат даты)
let b = moment("2018-03-10", "YYYY-MM-DD"); // 2я дата
a.diff(b, 'days')   // Разница в днях 

// Либо так 
moment.duration(a.diff(b)).asDays() // Разница в днях


Дока по moment js
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
@skazi_premiere
Верстаем как умеем ;) HTML/CSS/JS
var now = new Date();
var day = now.getDate()
console.log(day)
if ( day & 1 ) {
    alert( "нечетно" );
} else {
    alert( "четно" );
}
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы