Table of Contents
Write a code to create Countdown Timer in JavaScript
It best and simple Javascript program to create Countdown Timer.
Output: Javascript program to create countdown timer
Write a Javascript program for countdown timer
HTML code
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Countdown Timer - ITVoyagers</title> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous"> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script> <script type="text/javascript" src="jquery.min.js"></script> <script type="text/javascript" src="popper.min.js"></script> <script type="text/javascript" src="bootstrap.min.js"></script> </head> <body> <div class="text-center"> <label class="h1">Time Left <br><span id="cntdwn_timer"></span></label> </div> <script type="text/javascript" src="countdown_timer.js"></script> </body> </html>
Javascript code (countdown_timer.js)
const initialTiming = 8; var time = initialTiming * 86400; var cntdwn_timer = document.getElementById("cntdwn_timer"); var countdownIntervalId = setInterval(countdown_timer,1000); //itvoyagers.in function countdown_timer() { if(time!=0) { days = Math.floor(time/86400); hours = Math.floor((time/3600)%24); minutes = Math.floor((time/60)%60); second = time%60; days = days < 10 ? '0' + days : days; hours = hours < 10 ? '0' + hours : hours; minutes = minutes < 10 ? '0' + minutes : minutes; second = second < 10 ? '0' + second : second; cntdwn_timer.innerHTML = `${days}<sub>D</sub> : ${hours}<sub>H</sub> : ${minutes}<sub>M</sub> : ${second}<sub>S</sub>`; time--; } else { cntdwn_timer.innerHTML = "00:00:00:00"; clearInterval(countdownIntervalId); } //itvoyagers.in }