Count Up timer with JQuery

Question

I have Count Down Timer and its fine. And i am trying to convert this into COUNT UP TIMER. I am confused in this task.

I am gone through many ways but not the exact answer.

HTML Code

<div class="tk_countup_time p-0 transparent_bg box_shadow_none animation" data-animation="fadeInUp" data-animation-delay="1.2s" data-time="2025/02/28 00:00:00"></div>

JQuery Code

$('.tk_countup_time').each(function() {
        var endTime = $(this).data('time');
        $(this).countdown(endTime, function(tm) {
            $(this).html(tm.strftime('<span class="counter_box"><span class="tk_counter days">%D </span><span class="tk_text">Days</span></span><span class="counter_box"><span class="tk_counter hours">%H</span><span class="tk_text">Hours</span></span><span class="counter_box"><span class="tk_counter minutes">%M</span><span class="tk_text">Minutes</span></span><span class="counter_box"><span class="tk_counter seconds">%S</span><span class="tk_text">Seconds</span></span>'));
        });
    });

Answer 1

Assuming you are using jQuery countdown, you can set elapse:true so that it continues counting after it reaches zero, than set the finish time to the current date, so it immediately starts counting up.

let now = new Date().getTime();
$('#clock').countdown(now, {elapse: true})
.on('update.countdown', function(event) {
  var $this = $(this);
  $this.html(event.strftime('Counting Up: <span>%H:%M:%S</span>'));
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.countdown/2.2.0/jquery.countdown.min.js"></script>
<div id="clock"></div>