Loop countdown script

Asked

Viewed 187 times

0

I needed to make my countdown count when arriving at the final time it repeated the counting process again. I tried to find solutions here, but personally I couldn’t make it work.

<center><div style="color:#000000; font-size: 85px; font-weight: normal" id="dday"></div></center>

<script>
// Set the date we're counting down to
var countDownDate = new Date("April 25, 2022 12:00:00").getTime();

// Update the count down every 1 second
var x = setInterval(function() {

  // Get todays date and time
  var now = new Date().getTime();

  // Find the distance between now an the count down date
  var distance = countDownDate - now;

  // Time calculations for days, hours, minutes and seconds
  var days = Math.floor(distance / (1000 * 60 * 60 * 24));
  var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
  var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
  var seconds = Math.floor((distance % (1000 * 60)) / 1000);

  // Display the result in the element with id="demo"
  document.getElementById("dday").innerHTML = days + "d " + hours + "h "
  + minutes + "m " + seconds + "s ";

  // If the count down is finished, write some text 
  if (distance < 0) {
    clearInterval(x);
    document.getElementById("dday").innerHTML = "REPETIR O CONTADOR AQUI, LOOP!";
  }
}, 1000);
</script>

  • Failed to specify the logic to change Countdown date.

1 answer

1

There is no way the program knows the next date that the counter must repeat, so you must create a function that calculates the date in a distance of time and then reset at the end of the Interval

// Lembra da data alvo
var dataCountdownISO = "April 25, 2022 12:00:00"
// data de agora a 15 segundos para exemplo
function daquiA15Segundos() {
  dataCountdownISO = new Date(Date.now() + (15 * 1000)).toISOString()
}
daquiA15Segundos()
// Set the date we're counting down to
var countDownDate = new Date(dataCountdownISO).getTime();

// Update the count down every 1 second
var x = setInterval(function() {

  // Get todays date and time
  var now = new Date().getTime();

  // Find the distance between now an the count down date
  var distance = countDownDate - now;

  // Time calculations for days, hours, minutes and seconds
  var days = Math.floor(distance / (1000 * 60 * 60 * 24));
  var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
  var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
  var seconds = Math.floor((distance % (1000 * 60)) / 1000);

  // Display the result in the element with id="demo"
  document.getElementById("dday").innerHTML = days + "d " + hours + "h " +
    minutes + "m " + seconds + "s ";

  // If the count down is finished, write some text 
  if (distance < 1000) {
    // redefine o contador e continua a funcionar :)
    daquiA15Segundos()
    countDownDate = new Date(dataCountdownISO).getTime()
  }
}, 1000);
<center>
  <div style="color:#000000; font-size: 85px; font-weight: normal" id="dday"></div>
</center>

Browser other questions tagged

You are not signed in. Login or sign up in order to post.