<html>
<head>
<title>Countdown Clock</title>
<script type="text/javascript">
function convert(){
var seconds = document.getElementById("inputted_seconds").value;
if(isNaN(seconds)){
alert("Please enter a valid number.");
}else{
document.getElementById("inputted_seconds").setAttribute("disabled","disabled");
document.getElementById("start").setAttribute("disabled","disabled");
var days = seconds/60/60/24;
days = parseInt(days.toString());
seconds = seconds - days*24*60*60;
var hours = seconds/60/60;
hours = parseInt(hours.toString());
seconds = seconds - hours*60*60;
var minutes = seconds/60;
minutes = parseInt(minutes.toString());
seconds = seconds - minutes*60;
document.getElementById("countdown_clock").innerHTML = days+"d "+hours+"h "+minutes+"m "+seconds+"s";
t = setTimeout("start_countdown("+days+","+hours+","+minutes+","+seconds+")",0);
}
}
function start_countdown(days,hours,minutes,seconds){
if(seconds==-1){
minutes--;
seconds = 59;
}
if(minutes==-1){
hours--;
minutes = 59;
}
if(hours==-1){
if(days>0){
days--;
hours = 23;
}
}
document.getElementById("countdown_clock").innerHTML = days+"d "+hours+"h "+minutes+"m "+seconds+"s";
if(days==0 && hours==0 && minutes==0 && seconds==0){
alert("Countdown is finished.");
document.getElementById("inputted_seconds").removeAttribute("disabled");
document.getElementById("start").removeAttribute("disabled");
document.getElementById("countdown_clock").innerHTML = "Countdown is finished.";
}else{
seconds--;
t = setTimeout("start_countdown("+days+","+hours+","+minutes+","+seconds+")",1000);
}
}
</script>
</head>
<body>
<label for="inputted_seconds">Input Seconds</label> <input type="text" id="inputted_seconds" /> <input type="button" id="start" value="Start Countdown" onclick="convert();" />
<div id="countdown_clock"></div>
</body>
</html>
No comments:
Post a Comment