Skip to content

Instantly share code, notes, and snippets.

@anuj9196
Last active August 9, 2019 05:52
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save anuj9196/7637563581e666a52f5ff8a9ed2a0cf2 to your computer and use it in GitHub Desktop.
Save anuj9196/7637563581e666a52f5ff8a9ed2a0cf2 to your computer and use it in GitHub Desktop.
Display a countdown timer
// Set the date we're counting down to
var obj = document.getElementById("tbe-countdown");
var date = obj.getAttribute("data-date");
if (!date || date == "") {
console.error("Date should be of formate: Mon d, YYYY HH:mm:ss");
}
var countDownDate = new Date(date).getTime();
// Update the count down every 1 second
var x = setInterval(function() {
// Get today's date and time
var now = new Date().getTime();
// Find the distance between now and 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);
// Output the result in an element with id="demo"
var timerString = '';
if (days) {
timerString += "<span class='days'>" + days + "d </span>";
}
if (hours) {
timerString += "<span class='hours'>" + hours + "h </span>";
}
if (minutes) {
timerString += "<span class='minutes'>" + minutes + "m </span>";
}
if (seconds) {
timerString += "<span class='seconds'>" + seconds + "s </span>";
}
obj.innerHTML = timerString;
// If the count down is over, write some text
if (distance < 0) {
clearInterval(x);
obj.innerHTML = "EXPIRED";
}
}, 1000);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment