This script allows your visitors to specify a date and time that they want to countdown to, not like other scripts, where they countdown to the author's specified date! Let your visitor's choose! If you use this script, please e-mail me at bfprusia@idir.net and give me your feedback on this script! Please nominate this script!
The Countdown Script is one of the best scripts that we at JavaScript Village have ever made! This is not like any other javascript countdown. This lets the user to input a date and event into the fields to see how far away their special event is! This allows you to also input time into the script. Try this out! Here are some examples:
When Specifying dates in the new millenium, please use the full year! Ex: 2001
- 9/12/1998 17:26:12 - Do this if you want to see how much seconds are until the actual time of day! When entering time, use the military time scale
- 9/12/1998 - Do this if you want to see how far it is until 12:00 on that day.
- September 12, 1998 - Text also works with this! Be sure to spell the text right!
What it looks like (TRY IT!):
Note: To refresh the countdown stats, go back to this page, and click calculate!
Source Code:
<![CDATA[
<SCRIPT LANGUAGE="Javascript">
<!-- Script Made by Ben Prusia -- http://www.idir.net/~bfprusia/JavaVillage/ -->
function countdown() {
var cdate = document.form.date.value
var event = document.form.wow.value
var countdate = new Date(cdate);
var current = new Date();
var math = countdate.getTime() - current.getTime();
var years = Math.floor(math / (1000 * 60 * 60 * 24 * 365.25));
var months = Math.floor(math / (1000 * 60 * 60 * 24 * 30.5));
var weeks = Math.floor(math / (1000 * 60 * 60* 24 * 7));
var days = Math.floor(math / (1000 * 60 * 60 * 24));
var hours = Math.floor(math / (1000 * 60 * 60));
var minutes = Math.floor(math / (1000 * 60));
var seconds = Math.floor(math / (1000));
document.write("<TITLE>Countdown Results</TITLE>")
document.write("<BODY BGCOLOR=#FFFFFF>")
document.write("<font face=verdana size=2>")
document.write("<center><B>Countdown Results</B></center>")
document.write("<HR>")
document.write("<center>")
document.write("<table width=500 bgcolor=lightgreen border=1><td><center>")
if (years > -1) {
document.write("Only <B>" + years + "</B> years until <B>" + event + "</B><BR>")
}
else {
document.write("<B>The Event Specified</B><BR>")
}
if (months > -1) {
document.write("Only <B>" + months + "</B> months until <B>" + event + "</B><BR>")
}
else {
document.write("<B>is today</B><BR>")
}
if (weeks > -1) {
document.write("Only <B>" + weeks + "</B> weeks until <B>" + event + "</B><BR>")
}
else {
document.write("<B>or has passed already</B><BR>")
}
if (days > -1) {
document.write("Only <B>" + days + "</B> days until <B>" + event + "</B><BR>")
}
else {
document.write("<B>Please specify a new date</B>")
}
if (days == -1) {
document.write("<HR>")
document.write("<center>Today is <B>" + event + "</B>!!!</center>")
}
if (hours > -1) {
document.write("Only <B>" + hours + "</B> hours until <B>" + event + "</B><BR>")
}
if (minutes > -1) {
document.write("Only <B>" + minutes + "</B> minutes until <B>" + event + "</B><BR>")
}
if (seconds > -1) {
document.write("Only <B>" + seconds + "</B> seconds until <B>" + event + "</B>")
}
document.write("</center></td></table>")
document.write("<center><P>Your Specified Date/Time was: <B>" + cdate + "</B></P></center>")
document.write("</center></font></body>")
}
</SCRIPT>
<!---Copy below and paste into body-->
<form name="form">
<table width=500 bgcolor=lightgreen border=1><td><center>
Countdown to Special Events!
</center></td></table>
<table width=500 bgcolor=lightgreen border=1><td width=200><center>
Date:
</center></td>
<td width=300><center>
<input type=text name=date size=30>
</center></td>
<tr>
<td width=200><center>
Event Name:
</center></td>
<td width=300><center>
<input type=text name=wow size=30>
</center></td>
<tr>
<td width=200><center>
<input type=button name=calculate value="Calculate!" onClick="countdown()">
</center></td>
<td width=300><center>
<input type=reset value="Clear Form">
</center></td>
</table>
</form>
]]>