Bucaro TecHelp
HTTPS Encryption not required because no account numbers or
personal information is ever requested or accepted by this site

About BTH User Agreement Privacy Site Map Contact News Feeds

Easy Java Script Code for Date Count Down

By Stephen Bucaro

One of the most powerful incentives for people to make a purchase is scarcity, and one of the most popular ways to create scarcity is have a "limited time" offer. You'll see this technique used all over the Web. "Buy within the next 8 hours and you'll get half off!". Of course we both know that "limited time" offer will be repeated over and over, but you can never be sure.

Web pages that present a limited time offer always have a count down timer to let you know how much time is left before you'll be required to pay regular price. In this article, I provide easy code to create for you to create a Java Script Date Count Down for your website.

But before I give you the code, lets take a quick look at the Java Script Date object. If we create a Date object without parameters, it will return the current date based on the computer’s clock. Show below is code to create a Date object and store it in a variable named "thisDate".

var thisDate = new Date();

The Date object has a method named getTime() that returns the number of milliseconds since the the date specified by the instance of the Date object (in this case now) and January 1, 1970.

thisDate.getTime();

Now if we could get the number of milliseconds since the date and time that our limited time offer expires and January 1, 1970, we could subtract that from the current milliseconds to determine how much time was left on our offer. In fact we can actually do that by creating a Date object with our expire date as a parameter.

There are several different formats you can use to pass a date to the Date object, one format is shown below.

Date(month, day, year, hour, minutes, seconds);

I like this format because it includes the exact time down to the second, in other words, you might want to end your limited time offer at one minute after midnight on the morning of 09/17/2011. The code to create a Date object that returns the number of milliseconds since January 1, 1970 and one minute after midnight on the morning of 09/17/2011 is shown below.

var endDate = new Date('09/17/2011' + ' ' + '00:01:00AM');

Now we can easily subtract those milliseconds from the current milliseconds, as shown below.

var diff_ms = endDate.getTime() - thisDate.getTime();

This gives us the difference in milliseconds. You can use this in your own count down timers if you want to count down in milliseconds. You might find it a little inaccurate though because sometimes a computer gets too busy to update its display every millisecond.

By dividing the difference in milliseconds by the number of milliseconds in a day (1000 * 60 * 60 * 24) We can get the difference between those two dates in days. The code for this is shown below.

var diff_days = Math.floor(diff_ms/(1000 * 60 * 60 * 24));

This is fine if you want to display the time remaining in days, but to add to the drama, you might want to display the time remaining in days and hours. To do this, subtract the days (converted to milliseconds) from the total difference in milliseconds to get the left over milliseconds. Then divide that by the number of milliseconds in an hour. The code for this is shown below.

diff_ms -= diff_days * (1000 * 60 * 60 * 24);
var hours = Math.floor(diff_ms/(1000 * 60 * 60));

Note in the code above that we used the Math object's .floor method which drops the decimal part of the number, this causes it to always return the next integer less than or equal to the original value.