Days Counter Script

Days Counter Script

Days Counter Script : On the off chance that you’ve at any point considered the number of days are remaining from the date of launch, this content will reveal to you that. It very well may be adjusted to work with anytime, if not every one of them together!

We can show a days count script showing time left from an occasion. Let’s assume we are running a mission which will end following two days. Here we will show a counter saying days , hours , minutes and seconds left for the occasion to occur or the mission to end. This content uses the setTimeout work similarly as it is utilized in showing a changing clock script. Here this setTimeout script triggers another capacity in each 1000 factory seconds ( or in 1 sec ).

This content uses customer side JavaScript to produce the check down clock. The underlying worth in number of seconds left for the commencement to end will be passed to the capacity. At the hour of page stacking the seconds left ( a numeric worth ) is gathered and in light of this worth the days , hours, minutes and seconds are determined and shown.

Yon also check the days between two dates :

Days Calculator between two dates / JavaScript

HTML

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Days Counter</title>
</head>
<body>
    <div class="container">
        <div class="calendar">
            <div class="daysRemaining">
                Number of Days Remaining.
            </div>
            <div class="result" id="demo">

            </div>
        </div>

    </div>
</body>
</html>

CSS

.calendar {
            width: 99%;
            font-size: 50px;
            font-family: -webkit-pictograph;
            display: flex;
            justify-content: center;
            height: 90vh;
            align-items: center;
            border: 5px solid #b8ce9b;
            background-color: #d4efb1;
            flex-direction: column;
        }
        
        .daysRemaining {
            font-size: 15px;
        }

JavaScript

 // Set the date we're counting down to
 var countDownDate = new Date("Nov 24, 2021 09: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("demo").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("demo").innerHTML = "EXPIRED";
     }
 }, 1000);

Like us on Facebook – Online Portfolio

Please follow and like us:

Tagged in:

, , ,