Library code snippets

Count Down

This code lets you count down the number of days to a specific date

Add the following code to a file named clock-js.asp. Then add the second set of code to a HTML file in the same folder and run it. Because the timer needs pictures to display numbers, you have to create some, or take the ones attached to this code. If you create them name them nmbr#.gif (0 – 9).

var nTime = new Date(2000, 8, 15, 3, 55, -3, 0);
var nTarget = Date.UTC(2001, 10, 29, 16, 47, 0, 0) + nTime.valueOf() - 968896375889;

Tick();
if (document.all)
   window.setInterval('Tick()', 1000);
else
   window.setTimeout('Tick()', 100);

function Tick()
{
   var dNow = new Date();
   nTime = nTarget - dNow.valueOf();    // milliseconds until target
   if (nTime < 0) nTime = 0;
   nTime = Math.floor(nTime / 1000);    // seconds until target
   Display(document.cdDay1, document.cdDay0, 86400);    // seconds per day
   Display(document.cdHour1, document.cdHour0, 3600);    // seconds per hour
   Display(document.cdMinute1, document.cdMinute0, 60); // seconds per minute
   Display(document.cdSecond1, document.cdSecond0, 1); // seconds per second
   if (document.layers)
       window.setTimeout('Tick()', 100);
}
   
function Display(el1, el0, nDivisor)
{
   var nOnes;
   var nValue = (nTime - (nTime %= nDivisor)) / nDivisor;
   el1.src = "nmbr" + (nValue - (nOnes = nValue % 10)) / 10 + ".gif";
   el0.src = "nmbr" + nOnes + ".gif";
}


HTML Code



<Table>
   <FORM NAME=CLOCK>
   <tr valign="top">
       <td align=center><b>Days</b></td>
       <td> | </td>
       <td align=center><b>Hours</b></td>
       <td> | </td>
       <td align=center><b>Minutes</b></td>
       <td> | </td>
       <td align=center><b>Seconds</b></td>
   </tr>
   <tr>
       <td align=center><img name=cdDay1 src=""><img name=cdDay0 src=""></td>
       <td> </td>
       <td align=center><img name=cdHour1 src=""><img name=cdHour0 src=""></td>
       <td> </td>
       <td align=center><img name=cdMinute1 src=""><img name=cdMinute0 src=""></td>
       <td> </td>
       <td align=center><img name=cdSecond1 src=""><img name=cdSecond0 src=""></td>
   </tr>
</form>    
</table>
</div>
<script language="javascript" src="clock-js.asp"></script>

Comments

  1. 12 Oct 2002 at 01:03
    Sorry for replying so late, I don’t exactly check these things so often. I took a look at the code, and I really can’t remember how to set up the date. So I spent a wile rewriting the first two lines. Replace them with this.

    var nTarget = Date.UTC(2003, 0, 0, 0, 0, 0, 0) + 18000000;

    I would change this, but the approval system here hasn’t been very speedy lately. So doing so would disable this code for quite a wile. Anyway back to the code.

    This line will set the counter for new years day Jan 1 2003. Now to change it...
    The 2003 is the year
    The next parameter is the month – 1
    The next is the day of the month – 1
    And the next two are the time hours and minutes ware 0, 0 is 12:00AM and 22, 59 is 12:59PM
    The last in milliseconds

    So the date you requested would be
    2002, 11, 24, 0, 0, 0, 0
  2. 10 Sep 2002 at 17:28

    I am new to this. Can you tell me where I insert the date. For example, if I want to show the number of days until Christmas 2002?


    Thanks.

  3. 01 Jan 1999 at 00:00

    This thread is for discussions of Count Down.

Leave a comment

Sign in or Join us (it's free).

Nick Avery I am as a web developer for a small company, working for a small company. I work on banking websites and verious related projects.

We'd love to hear what you think! Submit ideas or give us feedback