<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title></title>
<link rel="stylesheet" href="style.css" />
<link rel="stylesheet" href="fonts.css" />
<script type="text/javascript" src="Countdown.js" ></script>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.1.min.js" ></script>
</head>
<body>
<div class="countdown">
<center>
<span class="days">00</span> Days
<span class="hours">00</span> Hours
<span class="minutes">00</span> Minutes
<span class="seconds">00</span> Seconds
</center>
</div>
</body>
</html>
body {
background: #119911
}
.countdown {
margin: 30px auto;
font-family: Arial;
color: #333;
font-size: 20px;
font-weight: bold;
}
.countdown span {
display: inline-block;
font-size: 20px;
color: #EEE;
background: #CC1111;
padding: 15px;
border-radius: 5px;
margin: 0px 3px 0px 7px;
} var countdown = {
month : 12,
day : 25,
year : 2014,
};
setInterval(function() {
d2 = new Date(countdown.month+'/'+countdown.day+'/'+countdown.year).getTime();
d1 = new Date().getTime();
difference = (d2-d1) / 1000;
countdown.days = Math.floor(difference / (60 * 60 * 24));
difference -= (countdown.days * (60 * 60 * 24));
countdown.hours = Math.floor(difference / (60 * 60));
difference -= (countdown.hours * (60 * 60));
countdown.minutes = Math.floor(difference / 60);
difference -= (countdown.minutes * 60);
countdown.seconds = Math.floor(difference);
countdown.days = countdown.days < 10 ? '0' + countdown.days.toString() : countdown.days;
countdown.hours = countdown.hours < 10 ? '0' + countdown.hours.toString() : countdown.hours;
countdown.minutes = countdown.minutes < 10 ? '0' + countdown.minutes.toString() : countdown.minutes;
countdown.seconds = countdown.seconds < 10 ? '0' + countdown.seconds.toString() : countdown.seconds;
$('.countdown .days').html(countdown.days);
$('.countdown .hours').html(countdown.hours);
$('.countdown .minutes').html(countdown.minutes);
$('.countdown .seconds').html(countdown.seconds);
}, 1000);