i want a simple javascript countdown that counts down from 5 or 10 seconds to 0 seconds and does NOTHING ELSE. lol. im redirecting the page with a meta refreshing and i want users to know e=when they'll be redirected
Printable View
i want a simple javascript countdown that counts down from 5 or 10 seconds to 0 seconds and does NOTHING ELSE. lol. im redirecting the page with a meta refreshing and i want users to know e=when they'll be redirected
Maybe use this count down timer as a guide.
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Timer</title>
<script type="text/javascript">
<!--
var timeLeft = 0;
var begin
function startTimer() {
//check for null input hours, minutes, seconds
if(document.getElementById("txtHours").value == ""){
document.getElementById("txtHours").value = "0";
}
if(document.getElementById("txtMinutes").value == ""){
document.getElementById("txtMinutes").value = "0";
}
if(document.getElementById("txtSeconds").value == ""){
document.getElementById("txtSeconds").value = "0";
}
//get input hours, minutes, seconds
var hours = parseInt(document.getElementById("txtHours").value);
var minutes = parseInt(document.getElementById("txtMinutes").value);
var seconds = parseInt(document.getElementById("txtSeconds").value);
//calculate time left in seconds
timeLeft = (hours * 3600) + (minutes * 60) + seconds;
//start count down timer
begin=setInterval("countDown()",1000);
}
function countDown() {
var hoursLeft = 0;
var minutesLeft = 0;
var secondsLeft = 0;
var remainder = 0;
timeLeft = timeLeft-1;
if(timeLeft >= 0){
//break down time left into hours, minutes, seconds
hoursLeft = Math.floor(timeLeft/3600);
remainder = timeLeft%3600;
minutesLeft = Math.floor(remainder/60);
remainder = remainder%60;
secondsLeft = remainder;
document.getElementById('cellHours').innerHTML = hoursLeft;
document.getElementById('cellMinutes').innerHTML = minutesLeft;
document.getElementById('cellSeconds').innerHTML = secondsLeft;
} else {
clearInterval(begin);
}
}
//-->
</script>
</head>
<body>
<form>
<!-- Table to input total time -->
<table>
<caption style="font-weight: bold">Total Time</caption>
<th>Hours</th>
<th>Minutes</th>
<th>Seconds</th>
<tr>
<td><input type="text" id="txtHours" value="0" size="5" /></td>
<td><input type="text" id="txtMinutes" value="0" size="5" /></td>
<td><input type="text" id="txtSeconds" value="0" size="5" /></td>
</tr>
</table>
<!-- Table to output time left -->
<table name="tblTimer" id="tblTimer" width="500px" style="margin: 70 0 0 0" border="1">
<caption style="font-weight: bold">Time Left</caption>
<th>Hours Left</th>
<th>Minutes Left</th>
<th>Seconds Left</th>
<tr>
<td id="cellHours" align="center">0</td>
<td id="cellMinutes" align="center">0</td>
<td id="cellSeconds" align="center">0</td>
</tr>
</table>
<!-- Display control buttons -->
<table style="margin: 50 0 0 0">
<tr>
<td>
<input type="button" value="Start Timer"
onclick="startTimer();" />
</td>
<td>
<input type="button" value="Stop Timer"
onclick="clearInterval(begin);" />
</td>
</tr>
</table>
</form>
</body>
</html>
lol it's scripts like the one you showed that drove me here. i don't want terribly advanced scripts or anything i want something short and sweet that will display 10,9,8,7,6,5,4,3,2,1,0 - and do nothing else.
That was short and sweet :D
Just delete the html and javascript you don't need and tweak the rest to suit and set a start timer.
If you know what you are doing, and I can't tell from your original post how much you know about html and javascript, it should take you no more than 5 minutes.
Surely you're not asking to be spoon fed the code, are you ;)
im asking to be spoon fed code that has only the things necessary for counting down seconds, and has nothing about minutes, hours, days, or javascript redirects
i know html and css but know nothing of js past implementing it into html, although i can read english and follow simple directions
ok :) - But I don't do spoon feeding, well not for free anyway :p
Hopefully someone else will come along and give you the code.
In the mean time, if you are interested in learning some javascript, maybe have a look at the w3schools setInterval() tutorial to do what you want.
