05/18/04 updated 12/17/05
T his dynamic countdown script is accurate to the second. This allows you to count down to a particular event that's time sensitive (and not just day) but to the minute and second. It also gives you an alternate message once the countdown has been complete. This script works with both Netscape 4 and Internet Explorer 4+.
W e have tested the code in IE5.5, IE6.0, Firefox0.9.1, Opera7.54 and Netscape7.02. This script worked well in all platforms with no variations observed.
D epending on your knowlede of HTML and java scripts, this is an easy, one step copy and paste code that is placed anywhere in the <BODY> section of your document that you want it to appear. The reconfigurations are quite simple so we will first show you the default and then our reconfigurations for you to see how we achieved we did withis this script.
//////////CONFIGURE THE COUNTDOWN SCRIPT HERE//////////////////
//STEP 1: Configure the countdown-to date, in the format year, month, day, hour
(0=midnight,23=11pm), minutes, seconds:
setcountdown(2002,12,07,18,30,00)
//STEP 2: Change the two text below to reflect the occasion, and message to display on that occasion, respectively
var occasion="Bulls vs Lakers game"
var message_on_occasion="Go Chicago Bulls!"
//STEP 3: Configure the below 5 variables to set the width, height, background color,
and text style of the countdown area
var countdownwidth='520px'
var countdownheight='35px'
var countdownbgcolor='lightyellow'
var opentags='<font face="Verdana"><small>'
var closetags='</small></font>'
//////////DO NOT EDIT PAST THIS LINE//////////////////
N otice we added a complete font tag just above the start of the script. This was so the font would blend in seamlessly within our page. We just used font size 4 instead of our base size of 3.
<font face="georgia,arial,helvetica"size="4"color="#fff0f5">
<script language="JavaScript1.2">
//////////CONFIGURE THE COUNTDOWN SCRIPT HERE//////////////////
//STEP 1: Configure the countdown-to date, in the format year, month, day, hour
(0=midnight,23=11pm), minutes, seconds:
setcountdown(2002,12,25,00,00,00)
//STEP 2: Change the two text below to reflect the occasion, and message to display on that occasion, respectively
var occasion="Christmas 2003"
var message_on_occasion="Merry Christmas 2003"
//STEP 3: Configure the below 5 variables to set the width, height, background color,
and text style of the countdown area
var countdownwidth='550px'
var countdownheight='35px'
var countdownbgcolor='black'
var opentags='<font face="georgia,arial,helvetica"size="4"color="#fff0f5">'
var closetags='</font>'
//////////DO NOT EDIT PAST THIS LINE//////////////////
A
few final note on how we achieved the different colors within the messages and the removal of certain tags.
var occasion="Christmas 2003"
var message_on_occasion="Merry Christmas 2003"
T he above was done as you can see in the below script and be sure you use the single ' and not the " in this part of the script or you will get an error message to appear.
var occasion="<font color='red'>Christ</font><font color='lime'>mas</font> <font color='red'>2003</font>"
var message_on_occasion="<font color='red'>Merry</font> <font color='lime'>Christmas</font> <font color='red'>2003</font>"
W here we added the complete font tag it will work with the " as you can see in the below example.
var opentags='<font face="georgia,arial,helvetica"size="3"color="#fff0f5">'
T he last thing we will cover is the removal of the <small></small> tags. If you change the font size and leave these tags in, it is counter productive and they will conflict within the script. You will see these in the default and are removed without reconfigurations.
I
you would like to add this effect into your pages, grab the respective below link and you are there. We hope our tutorial was easy to follow and we covered everything in detail. If you have any problems with this or anything else, feel free to consult our [ FAQ ] and if you can't find the answer there, [ contact us ].
[ Get Code Here ]
[ Rate This Page ]
|
Search Our Site By Individual letter
[ A ]
[ B ]
[ C ]
[ D ]
[ E ]
[ F ]
[ G ]
[ H ]
[ I ]
[ J-K ]
[ L ] |
|
Little Tips Directory [ Page 1 ] [ Page 2 ] [ Page 3 ] [ Page 4 ] [ Page 5 ] [ Page 6 ] [ Page 7 ] |
|
[ Index Page 1 ]
[ Index Page 2 ]
[ Index Page 3 ]
[ Index Page 4 ]
[ Index Page 5 ] [ Index Page 6 ] [ Index Page 7 ] [ Index Page 8 ] [ Index Page 9 ] [ Index Page 10 ] [ Index Page 11 ] [ Index Page 12 ] [ Index Page 13 ] [ News Letter Archives ]
[ Navigation Page ]
[ Archives Of Published Material ] |
If you are part of the ever growing number of webmasters who enjoy
sharing your knowledge with others on web design, join The
Consigliere Ltd. web ring to broaden your scope of exposure.
Join Today
This Site Was Built And Is Maintained Exclusively by
The Webmaster @ Consigliere Ltd.
Copyright © Consigliere Ltd., All Rights Reserved. 2001-