Home > Back-end >  Can't create countdown in javascript. Something doesn't work :(
Can't create countdown in javascript. Something doesn't work :(

Time:11-17

I am creating countdown for the "coming soon page", but it doesn't works, it always says 00:00:00:00 Can you help me please.

<script> 

var countDownDate = new Date("Jan 5, 2024 15:37:25").getTime(); var x = setInterval (function(){ var now = new Date().getTime; var distance = countDowndate - now;

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);


document.getElementById("days").innerHTML = days; document.getElementById("hours").innerHTML = hours; document.getElementById("minutes").innerHTML = minutes; document.getElementById("seconds").innerHTML = seconds;

if (distance < 0) { clearInterval (x); document.getElementById("days").innerHTML = "00"; document.getElementById("hours").innerHTML = "00"; document.getElementById("minutes").innerHTML = "00"; document.getElementById("seconds").innerHTML = "00";
    }

1000); </script>
<div >
    <div>
        <p id="days">00</p>
        <span>days</span>
    </div>
    <div>
        <p id="hours">00</p>
        <span>Hours</span>
    </div>
    <div>
        <p id="minutes">00</p>
        <span>Minutes</span>
    </div>
    <div>
        <p id="seconds">00</p>
        <span>Seconds</span>
    </div> </div>

I tried to create countdown for the website coming soon page. It should tell how much time it is left, but it always says 00:00:00:00

CodePudding user response:

Your current javascript code has 2 errors. You need to fix them as follows:

var now = new Date().getTime();      // getTime
var distance = countDownDate - now;  // countDowndate

Here is entire solution:

    var countDownDate = new Date("Jan 5, 2024 15:37:25").getTime();
    var x = setInterval(function () {
        var now = new Date().getTime(); 
        var distance = countDownDate - now;

        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);


        document.getElementById("days").innerHTML = days; document.getElementById("hours").innerHTML = hours; document.getElementById("minutes").innerHTML = minutes; document.getElementById("seconds").innerHTML = seconds;

        if (distance < 0) {
            clearInterval(x); document.getElementById("days").innerHTML = "00"; document.getElementById("hours").innerHTML = "00"; document.getElementById("minutes").innerHTML = "00"; document.getElementById("seconds").innerHTML = "00";
        }

    }, 1000);

CodePudding user response:

var countDownDate = new Date(("Jan 05 2024 15:37:25 GMT") ).getTime();

var x = setInterval (function(){ 

var now = new Date().getTime(); 
var distance = countDownDate - now; 
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); 
if (distance < 0) { 
    clearInterval (x); 
    document.getElementById("days").innerHTML = "00"; 
    document.getElementById("hours").innerHTML = "00"; 
    document.getElementById("minutes").innerHTML = "00"; 
    document.getElementById("seconds").innerHTML = "00";
}

}, 1000)
  • Related