RSS

Countdown timer in javascript

11 Jul

Just provide expiry date and time in the script.

Example: var exp = montharray[Month – 1] + ” ” + Day + “, ” + Year + ” ” + Hour + “:” + Minute + “:” + Second;

After expired, It will show the alert “Time expiry.”,  Insted of timer it will show the text “The time has come!”

<html>
<body>
<div id="countdown_time"></div>
<script type="text/javascript">
var montharray = new Array("Jan", "Feb", "Mar", "Apr", "May", "Jun"
,"Jul", "Aug", "Sep", "Oct", "Nov", "Dec")
window.onload=function(){ 
updateTime();
}
function updateTime() {
today = new Date();
var todayy = today.getYear();
if (todayy < 1000)
todayy += 1900;
var curr = montharray[today.getMonth()] + " " + today.getDate()
+ ", " + todayy + " " + today.getHours() + ":"
+ today.getMinutes() + ":" + today.getSeconds();
var exp = montharray[7 - 1] + " " + 10 + ", " + 2012 + " " + 18 
+ ":" + 14 + ":" + 00;
timeLeft = Date.parse(exp) - Date.parse(curr);
msPerDay = 24 * 60 * 60 * 1000;
e_daysLeft = timeLeft / msPerDay;
daysLeft = Math.floor(e_daysLeft);
e_hrsLeft = (e_daysLeft - daysLeft) * 24;
hrsLeft = Math.floor(e_hrsLeft);
e_minsLeft = (e_hrsLeft - hrsLeft) * 60;
minsLeft = Math.floor(e_minsLeft);
scesLeft = Math.floor((e_minsLeft - minsLeft) * 60);
document.getElementById("countdown_time").innerHTML = "<table "
+"border=0 width='160px'><tr><td align='right'>"
+ daysLeft
+ "</td><td align='left' colsapn='2'>Days</td> <td align='right'>"
+ hrsLeft
+ "</td><td align='left' colsapn='2'>Hours</td><td align='right'>"
+ minsLeft
+ "</td><td align='left' colsapn='2'>Mins</td><td align='right'>"
+ scesLeft
+ "</td><td align='left' colsapn='2'>Secs</td></tr></tbody></table>";
if (timeLeft > 1000) {
setTimeout('updateTime()', 1000);
} else {
alert("Time expiary.");
document.getElementById("countdown_time").innerHTML =
"The time has come!";
}
}
</script>
</body>
</html>
 
Leave a comment

Posted by on July 11, 2012 in General, Javascript

 

Tags: , ,

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

 
%d bloggers like this: