Jump to content

Archived

This topic is now archived and is closed to further replies.

master82

Countdown timer - Noob!!!

Recommended Posts

i currently have a php page that has a calculation on it. The calculation looks at a stored (SQL database) unix timestamp and the current time and works out how long it will be to that stored time. Simple, but its static and only updates upon refresh.

So is it possible to create a live countdown to show how long is left from the unix timestamp stored on my SQL database (can be placed into a variable in php)?

And if so, is it possible to set it so that upon reaching the time 00:00:00 to refresh the page?

I've never done any JS before so if anyone could help id be greatful :)

Share this post


Link to post
Share on other sites
you could use setTimeout or setInterval to run a script (or call a function) that rewrites a countdown number on a webpage.

[code=php:0]<div name='mydiv'>100</div>
< script type='text/javascript'>
var mycount=100;
var my_interval = setInterval("document.getElementById('mydiv').innerHTML = mycount--;",1000);
</script>[/code]

That should count down from 100 seconds, but it wouldn't stop at 0. You'll need to beef it up by creating a function that refreshes (or stops) when the counter hits zero. You'd probably also want to write an interpreter that would convert the seconds to days, hours, minutes, and seconds. For example, instead of 10,000 seconds, the visitor would see 2:46:45.

Here's some info on setTimeout and setInterval
http://developer.mozilla.org/en/docs/DOM:window.setTimeout
http://developer.mozilla.org/en/docs/DOM:window.setInterval

Share this post


Link to post
Share on other sites
Try this: [code]< script type="text/javascript">
var start = 10
var now = start
var interval = setInterval('update_countdown()',1000);

function update_countdown()
{
now = now-1
if(now >= 0)
{
document.getElementById('countdown').innerHTML = now
}
else {
clearInterval(interval)
}
}
</script>

<div>There is <span id="countdown">10</span> seconds left.</div>[/code]

Share this post


Link to post
Share on other sites

×

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.