PDA

Click to See Complete Forum and Search --> : timer using images

lEZA
10-10-2003, 04:15 AM
hi

i need a timer that accepts a user's input of minutes and seconds. and then on submit, a countdown to zero must be displayed using gif files representing the numbers 0 to 9.

i have called the gif files 0.gif, 1.gif, 2.gif etc.

please share any ideas

l.
Gollum
10-10-2003, 09:33 AM
Have a look at this...

<html>
<head>
<script>
function txt2img(txt)
{
txt = txt.toString();
// assuming 0.gif, 1.gif, etc
var ret = "";
for ( var i = 0; i < txt.length; i++ )
{
ret += '<img src="' + txt.charAt(i) + '.gif">';
}
return ret;
}
var nSec;
function go()
{
var m = document.getElementById('min').value;
var s = document.getElementById('sec').value;

nSec = parseInt(m) * 60 + parseInt(s);

window.setTimeout("animate();", 1000);
}
function animate()
{
nSec--;
if ( nSec > 0 )
{
document.getElementById('timer').innerHTML = txt2img(nSec);
window.setTimeout("animate();",1000);
}
else
{
document.getElementById('timer').innerHTML = "Blastoff!!!";
}
}
</script>
</head>
<body>
<span id=timer>
Time - <input id=min type=text>:<input id=sec type=text><br>
<button onclick="go();">Go</button>
</span>
</body>
</html>


... Should give you some pointers.