How to detect when Harshen’s jQuery-countdownTimer reaches 00:00

Tags: , ,



I’m integrating Harshen Panday’s countdownTimer plugin, but I want to print hello when it reaches 00:00. Is there any way I can get notified of that event?

$(function() {
  $('#ms_timer').countdowntimer({
    minutes: 03,
    seconds: 00,
    size: "lg"
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript" src="https://harshen.github.io/jquery-countdownTimer/jquery.countdownTimer.min.js"></script>

<span id="ms_timer" class="d-block mb-2"></span>
<h3 id="getTime" class="mb-3 text-uppercase"><b>Book Consultation</b></h3>
<h5 id="getPrice"><b class="strike">RS. 500</b></h5>
<h2 class="mb-0"><b>RS. 300</b></h2>

Answer

The documentation gives timeUp:

timeUp

  • Type: Function
  • Default: null
  • The name of the callback function that is invoked when the countdown reaches zero. Within the function this refers to the division that holds the widget. No parameters are passed in. Provide the name to this option without quotes.

$(function() {
  $('#ms_timer').countdowntimer({
    minutes: 00,
    seconds: 05,
    size: "lg",
    timeUp: () => console.log("Hello")
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript" src="https://harshen.github.io/jquery-countdownTimer/jquery.countdownTimer.min.js"></script>
<span id="ms_timer" class="d-block mb-2"></span>
<h3 id="getTime" class="mb-3 text-uppercase"><b>Book Consultation</b></h3>
<h5 id="getPrice"><b class="strike">RS. 500</b></h5>
<h2 class="mb-0"><b>RS. 300</b></h2>


Source: stackoverflow