Javascript / JQuery отсчет заморозить в 00:00

0

Я запрограммировал этот обратный отсчет js/jquery. Как я могу сделать, когда разница во времени равна 0, что мой таймер замерзает в 00:00 и остается таким же в течение 1: 30 мин и меняется на красный шрифт? Пример: время Remainig 00:05, после 5 секунд 00:00 (красный шрифт), и он остается таким же в течение 1:30.

var timer1;
function cdtd1() {
    var sad1 = new Date();
    var dolazak1 = new Date(sad1.getFullYear(),sad1.getMonth(),sad1.getDate(),13,01,00);
    var timeDiff1 = dolazak1.getTime() - sad1.getTime();
    if (timeDiff1 <= 0) {
        clearInterval(timer1);
        $("#Box1").remove();
    }
    if (timeDiff1 > 1500000) {
        clearInterval(timer1);
        $("#Box1").remove();
    }


    var sekunde1 = Math.floor(timeDiff1 / 1000);
    var minute1 = Math.floor(sekunde1 / 60);
    var sati1 = Math.floor(minute1 / 60);
    var dani1 = Math.floor(sati1 / 24);
    sati1 %= 24;
    minute1 %= 60;
    sekunde1 %= 60;

    $("#dani1Box").html(dani1);
    $("#sati1Box").html(sati1 + ':');
    $("#minute1Box").html('7-Dubrava '+ minute1 + ':');
    $("#sekunde1Box").html(sekunde1);

    timer1 = setTimeout(cdtd1, 1000);
}

$(document).ready(function() {
     cdtd1();
});

Это html:

<div id="Box1">

<h1 style="font-family:Helvetica;color:#FFFFFF;font-size:5px;">&nbsp;</h1>

<div id="minute1Box"></div>

<div id="sekunde1Box"></div>

</div>
Теги:
countdown

1 ответ

1
Лучший ответ

Прежде всего, вам не нужно очищать свой таймер вообще, потому что вы используете setTimeout, который является таймером с огнем.

Вы должны не вызывать setTimeout, когда обратный отсчет либо сделано, или разница во времени попадает порог в 1500 секунд. Я бы сделал так:

if (timeDiff1 <= 0) {
    $("#Box1").remove();
    return;
}
if (timeDiff1 > 1500000) {
    $("#Box1").remove();
    return;
}

Во-вторых, чтобы ответить на ваш исходный вопрос, когда время Box1 нуля, просто установите класс css вашего Box1 в некоторый класс CSS, который имеет красный шрифт, а также установите для текста ваших элементов div нули. Затем установите новый тайм-аут для функции, которая удаляет ваш Box1 через 90 секунд.

И, кстати, рассмотрим использование text() вместо html() когда вы устанавливаете текстовое содержимое элемента, а не содержимое html.

if (timeDiff1 <= 0) {
    $("#Box1").addClass("timer-warning");

    $("#dani1Box").text("0");
    $("#sati1Box").text("0:");
    $("#minute1Box").text('7-Dubrava 0:');
    $("#sekunde1Box").text("0");

    setTimeout(function() {
        $("#Box1").remove();
    }, 90000);
    return;
}

В вашем файле CSS:

.timer-warning {
    color: #f00;
}

Ещё вопросы

Сообщество Overcoder
Наверх
Меню