| Aurons Ghost |
06-11-2007 07:33 PM |
Javascript countdown will not show.
Hi all. I've been thinking of adding a javascript countdown to an event I'm planning on my forum. I had a look round the 3.5 mods and didn't see anything I thought would apply all that well, and then went to google and found this:
http://scripts.franciscocharrua.com/countdown-clock.php
I tested it on a html file and the code seems to work fine. I then tried adding it to my templates, but it doesn't show up at all.
I added
Code:
<!-- Begin countdown script -->
<script type="text/javascript">
function countdown_clock(year, month, day, hour, minute, format)
{
//I chose a div as the container for the timer, but
//it can be an input tag inside a form, or anything
//who's displayed content can be changed through
//client-side scripting.
html_code = '<div id="countdown"></div>';
document.write(html_code);
countdown(year, month, day, hour, minute, format);
}
function countdown(year, month, day, hour, minute, format)
{
Today = new Date();
Todays_Year = Today.getFullYear() - 2000;
Todays_Month = Today.getMonth() + 1;
//Convert both today's date and the target date into miliseconds.
Todays_Date = (new Date(Todays_Year, Todays_Month, Today.getDate(),
Today.getHours(), Today.getMinutes(), Today.getSeconds())).getTime();
Target_Date = (new Date(year, month, day, hour, minute, 00)).getTime();
//Find their difference, and convert that into seconds.
Time_Left = Math.round((Target_Date - Todays_Date) / 1000);
if(Time_Left < 0)
Time_Left = 0;
switch(format)
{
case 0:
//The simplest way to display the time left.
document.all.countdown.innerHTML = Time_Left + ' seconds';
break;
case 1:
//More datailed.
days = Math.floor(Time_Left / (60 * 60 * 24));
Time_Left %= (60 * 60 * 24);
hours = Math.floor(Time_Left / (60 * 60));
Time_Left %= (60 * 60);
minutes = Math.floor(Time_Left / 60);
Time_Left %= 60;
seconds = Time_Left;
dps = 's'; hps = 's'; mps = 's'; sps = 's';
//ps is short for plural suffix.
if(days == 1) dps ='';
if(hours == 1) hps ='';
if(minutes == 1) mps ='';
if(seconds == 1) sps ='';
document.all.countdown.innerHTML = days + ' day' + dps + ' ';
document.all.countdown.innerHTML += hours + ' hour' + hps + ' ';
document.all.countdown.innerHTML += minutes + ' minute' + mps + ' and ';
document.all.countdown.innerHTML += seconds + ' second' + sps;
break;
default:
document.all.countdown.innerHTML = Time_Left + ' seconds';
}
//Recursive call, keeps the clock ticking.
setTimeout('countdown(' + year + ',' + month + ',' + day + ',' + hour + ',' + minute + ',' + format + ');', 1000);
}
</script>
<!-- End countdown script -->
inside the headinclude template and
Code:
<!-- Begin Countdown Call -->
<br />
<script type="text/javascript">countdown_clock(07, 07, 21, 00, 00, 1);</script>
<!-- End Countdown Call -->
just inside my header template, inside the same table field as my banner img.
I can't work out why it won't show up as when I do a view source it looks correctly nested so I was wondering if vB does something that would prevent it working...
Thanks for any help. :)
EDIT: hmm... it seems that its just firefox that's not displaying it on the forum... other browsers are showing it just fine :(
EDIT again: Yeah, never mind. I did a bit more searching and found this: http://www.dynamicdrive.com/dynamici...dhtmlcount.htm which seems to work well on my forum with the IE and firefox at least. |
More Information