Не нравятся результаты поиска? Попробуйте другой поиск!
DLE FAQ » Все вопросы » jQuery » Как вывести после окончания таймеры слово "вышел"?

Как вывести после окончания таймеры слово "вышел"?


     17.09.2020    Таймер    Все вопросы » jQuery    103

вопрос
Всем привет. Как сделать, чтобы после окончания таймера выводилась надпись "вышел". На данный момент после окончания таймера он просто пропадает.

Код таймера:
(function ( $ ) {
    function pad(n) {
        return (n < 10) ? ("0" + n) : n;
    }

    $.fn.showclock = function() {
     
        var currentDate=new Date();
        var fieldDate=$(this).data('datte').split('-');
        var fieldTime=[0,0];
        if($(this).data('time')!=undefined)
        fieldTime=$(this).data('time').split(':');
        var futureDate=new Date(fieldDate[0],fieldDate[1]-1,fieldDate[2],fieldTime[0],fieldTime[1]);
        var seconds=futureDate.getTime() / 1000 - currentDate.getTime() / 1000;

        if(seconds<=0 || isNaN(seconds)){
            this.hide();
            return this;
        }

        var days=Math.floor(seconds/86400);
        seconds=seconds%86400;
     
        var hours=Math.floor(seconds/3600);
        seconds=seconds%3600;

        var minutes=Math.floor(seconds/60);
        seconds=Math.floor(seconds%60);
     
        var html="";

        if(days!=0){
            html+="<div style='text-align: center; padding: 0 10px 0 0;' class='countdown-container days'>"
                html+="<span style='color: #47CB65; font-size: 18px; font-family: sans-serif;' class='countdown-value days-bottom'>"+pad(days)+"</span>";
                html+="<span class='countdown-heading days-top'><br />дней</span>";
            html+="</div>";
        }

        html+="<div style='text-align: center; padding: 0 10px 0 8px;' class='countdown-container hours'>"
            html+="<span style='color: #47CB65; font-size: 18px; font-family: sans-serif;' class='countdown-value hours-bottom'>"+pad(hours)+"</span>";
            html+="<span class='countdown-heading hours-top'><br />часов</span>";
        html+="</div>";

        html+="<div style='text-align: center; padding: 0 8px 0 8px;' class='countdown-container minutes'>"
            html+="<span style='color: #47CB65; font-size: 18px; font-family: sans-serif;' class='countdown-value minutes-bottom'>"+pad(minutes)+"</span>";
            html+="<span class='countdown-heading minutes-top'><br />минут</span>";
        html+="</div>";

        html+="<div style='text-align: center; padding: 0 0 0 8px;' class='countdown-container seconds'>"
            html+="<span style='color: #47CB65; font-size: 18px; font-family: sans-serif;' class='countdown-value seconds-bottom'>"+pad(seconds)+"</span>";
            html+="<span class='countdown-heading seconds-top'><br />секунд</span>";
        html+="</div>";

        this.html(html);
    };

    $.fn.countdown = function() {
        var el=$(this);
        el.showclock();
        setInterval(function(){
            el.showclock(); 
        },1000);
     
    }

}(jQuery));

jQuery(document).ready(function(){
    if(jQuery(".countdown").length>0){
        jQuery(".countdown").each(function(){
            jQuery(this).countdown(); 
        })
     
    }
})


Вывод самого таймера:
<div class='countdown' data-datte="2020-12-15" data-time="07:00"></div>

Ответил: akella


if(seconds<=0 || isNaN(seconds)){
            this.html("<div style='text-align:center'>вышел</div>");
            return this;
        }

2 комментария

akella
Юзер

akella - 17 сентября 2020 18:45 -

***Комментарий удален***

MrAstute
Юзер

MrAstute - 17 сентября 2020 19:40 -

akella,
Спасибо, помогло. Закройте тему.

Чтобы комментировать - войдите или зарегистрируйтесь на сайте

Похожие вопросы

наверх