Count Down Timer

Count Down Timer

by Nirvanachain

HTML

<h1>Time until July 31, 2014</h1>
<div id="daysContainer"></div>

<div id="hoursContainer"></div>

<div id="minutesContainer"></div>

<div id="secondsContainer"></div>

JavaScript

var daysContainer = document.getElementById('daysContainer'),
    hoursContainer = document.getElementById('hoursContainer'),
    minutesContainer = document.getElementById('minutesContainer'),
    secondsContainer = document.getElementById('secondsContainer'),
    days,
    hours,
    minutes,
    seconds;

// set the date we're counting down to
var target_date = new Date('July, 31, 2014').getTime();

setInterval(function () {
    // Find the ammount of "seconds" between now and the target_date
    var current_date = new Date().getTime();
    var seconds_left = (target_date - current_date) / 1000;
    
    days = parseInt(seconds_left / 86400);
    seconds_left = seconds_left % 86400;
    
    hours = parseInt(seconds_left / 3600);
    seconds_left = seconds_left % 3600;
    
    minutes = parseInt(seconds_left / 60);
    seconds = parseInt(seconds_left % 60);
    
    // format countdown string + set tag value
    daysContainer.innerHTML = '<span class="days">' + days + ' Days</span>';
    hoursContainer.innerHTML = '<span class="hours">' + hours + ' Hours</span>';
    minutesContainer.innerHTML = '<span class="minutes">' + minutes + ' Minutes</span>';
    secondsContainer.innerHTML = '<span class="seconds">' + seconds + ' Seconds</span>';

}, 1000);