Countdown Date & Time JavaScript

I need javascript to countdown a date but with time. I search a lot and find a solution. Here it is :)

You can use in your HTML file:

Dont worry! Only <script language="JavaScript">
TargetDate = "6/11/2010 1:00";
BackColor = "white";
ForeColor = "navy";
CountActive = true;
CountStepper = -1;
LeadingZero = true;
DisplayFormat = "%%D%% Day, %%H%% Hour, %%M%% Minute, %%S%% Second ";
FinishMessage = "World cup start..";
</script>
<script language="JavaScript" src="countdown.js"></script> left to begin World Cup 2010.


countdown.js

/*
Author: Robert Hashemian
<a href="http://www.hashemian.com/">http://www.hashemian.com/</a>

You can use this code in any manner so long as the author's
name, Web address and this disclaimer is kept intact.
*/

function calcage(secs, num1, num2) {
  s = ((Math.floor(secs/num1))%num2).toString();
  if (LeadingZero && s.length < 2)
    s = "0" + s;
  return "<b>" + s + "</b>";
}

function CountBack(secs) {
  if (secs < 0) {
    document.getElementById("cntdwn").innerHTML = FinishMessage;
    return;
  }
  DisplayStr = DisplayFormat.replace(/%%D%%/g, calcage(secs,86400,100000));
  DisplayStr = DisplayStr.replace(/%%H%%/g, calcage(secs,3600,24));
  DisplayStr = DisplayStr.replace(/%%M%%/g, calcage(secs,60,60));
  DisplayStr = DisplayStr.replace(/%%S%%/g, calcage(secs,1,60));

  document.getElementById("cntdwn").innerHTML = DisplayStr;
  if (CountActive)
    setTimeout("CountBack(" + (secs+CountStepper) + ")", SetTimeOutPeriod);
}

function putspan(backcolor, forecolor) {
 document.write("<span id='cntdwn' style='background-color:" + backcolor +
                "; color:" + forecolor + "'></span>");
}

if (typeof(BackColor)=="undefined")
  BackColor = "white";
if (typeof(ForeColor)=="undefined")
  ForeColor= "black";
if (typeof(TargetDate)=="undefined")
  TargetDate = "12/31/2020 5:00 AM";
if (typeof(DisplayFormat)=="undefined")
  DisplayFormat = "%%D%% Days, %%H%% Hours, %%M%% Minutes, %%S%% Seconds.";
if (typeof(CountActive)=="undefined")
  CountActive = true;
if (typeof(FinishMessage)=="undefined")
  FinishMessage = "";
if (typeof(CountStepper)!="number")
  CountStepper = -1;
if (typeof(LeadingZero)=="undefined")
  LeadingZero = true;
CountStepper = Math.ceil(CountStepper);
if (CountStepper == 0)
  CountActive = false;
var SetTimeOutPeriod = (Math.abs(CountStepper)-1)*1000 + 990;
putspan(BackColor, ForeColor);
var dthen = new Date(TargetDate);
var dnow = new Date();
if(CountStepper>0)
  ddiff = new Date(dnow-dthen);
else
  ddiff = new Date(dthen-dnow);
gsecs = Math.floor(ddiff.valueOf()/1000);
CountBack(gsecs);

Script Author: Robert Hashemian

Share and Enjoy:
  • StumbleUpon
  • Digg
  • TwitThis
  • FriendFeed
  • del.icio.us
  • MySpace
  • Technorati
  • Facebook
  • Google Bookmarks
  • Live

Enjoy this article?

Consider subscribing to our RSS feed!

Share us Facebook, FriendFeed, Digg

Liked by

This website uses IntenseDebate comments, but they are not currently loaded because either your browser doesn't support JavaScript, or they didn't load fast enough.

3 Comments

  1. Unkow
    18:45 on November 3rd, 2009

    excelent just what i was loking for

  2. sam
    13:08 on June 3rd, 2010

    thanks man. its helped me alot

Sorry, the comment form is closed at this time.

Oyun