John Davidson

javascript - countdown timer isn't showing up

0 comments
Message:


I was trying to create a countdown with php and js.
I am learning js and php at the moment so I wanted to try and combine these two to make a countdown in which days, hours, minutes and seconds are included. the outcome of this code only tells me till when it runs but not how much time is left, so the countdown itself isn't working. can anyone help?


  <?php 
$date = date('2022-02-26');
$time = date('23:59:59');
$date_today = $date . ' ' . $time;
echo "it will run till" .$date_today;
?>
<script type="text/javascript">
//set the date we are counting to
var count_id = "<?php echo $date_today; ?>";
var countDownDate = new Date(count_id).getTime();
//update countdown every second
var x = setInterval(function(){
//get today's date and time
var now = new date().getTime();
//find the distance between now and countdown 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);
// output the results in an elemtwith id="demo"
document.getElementById("demo").innerHTML = days + "d " + hours + "h " +
minutes + "m " + seconds + "s ";
// If the countdown over, write some text
if(distance<0){
clearInterval(x);
document.getElementById("demo").innerHTML="Expired"
}
},1000);
</script><?php
echo '<p id="demo" style="font-size:30px;"></p>';
?>


My Answer:
A countdown timer in JavaScript can be created using the `setInterval` function to update the timer every second. Here is an example of a simple countdown timer that counts down from a specified time:

javascript
// Set the countdown time in seconds
let countdownTime = 60;

// Display the initial countdown time
console.log(countdownTime);

// Update the countdown timer every second
let countdownInterval = setInterval(() => {
countdownTime--;

// Display the updated countdown time
console.log(countdownTime);

// Check if the countdown has reached zero
if (countdownTime === 0) {
clearInterval(countdownInterval); // Stop the countdown timer
console.log("Countdown has ended!");
}
}, 1000); // Update the countdown every 1000 milliseconds (1 second)


You can customize the countdown time and interval as needed for your specific use case. This example will log the countdown time to the console, but you can also update the DOM to display the countdown timer on a webpage.

Rate this post

4 of 5 based on 8856 votes

Comments




© 2024 Hayatsk.info - Personal Blogs Platform. All Rights Reserved.
Create blog  |  Privacy Policy  |  Terms & Conditions  |  Contact Us