I'm trying to create a timer that counts down in years, months, days, hours, minutes, seconds and milliseconds. I've found a few guides online, but they are sort of not easy to understand, or do not do the milliseconds. Can anyone help me do something like this, say, for this friday at 13:30.

so it could read 0y 0m 2d 2h 11m 50ms

and counts down the milliseconds. I would show code to demonstrate that I have actually tried to do this myself, but it all failed so dismally that i'd be embarrassed to.

I also read this article, which makes me mistrust javascript timers a bit. Is this true, that they bee so out of sync?

Thanks for any help!

I'm trying to create a timer that counts down in years, months, days, hours, minutes, seconds and milliseconds. I've found a few guides online, but they are sort of not easy to understand, or do not do the milliseconds. Can anyone help me do something like this, say, for this friday at 13:30.

so it could read 0y 0m 2d 2h 11m 50ms

and counts down the milliseconds. I would show code to demonstrate that I have actually tried to do this myself, but it all failed so dismally that i'd be embarrassed to.

I also read this article, which makes me mistrust javascript timers a bit. Is this true, that they bee so out of sync?

Thanks for any help!

• javascript
• jquery

• stackoverflow./questions/8067488/… – Ghokun Commented Apr 11, 2012 at 19:29
• Yes it is true that they bee out of sync. As a system administrator, I know that puter clocks can get way off (10 or 20 seconds) over the course just just weeks. After months they get get off by minutes. It is important to periodically sync to a standard time server. So making a javascript based count down would depend on the accuracy of your puter clock. – jeffery_the_wind Commented Apr 11, 2012 at 19:45
• Since you want to count down over many days, perhaps even weeks years or months, where do you want this program to run? On a web server? On your desktop puter? On a cell phone? – jeffery_the_wind Commented Apr 11, 2012 at 19:48
• i'd like it to run on a desktop puter. of course the out of sync issue isn't very critical; i'll just be looking at it for 1 second, and then have the info i want. But I thought it was an interesting concept and thought i may as well learn to implement it. – 1252748 Commented Apr 11, 2012 at 22:32

2 Answers 2

Depends how you implement it.

If you read the time once and depend on the setInterval or/and setTimeout for the accuracy then yes .. they can get out of sync.

If you always get the current time for using in your calculations, then it can go out of sync like the rest of your system goes out of sync... meaning that it follows the clock of the puter.

Altering my answer at JavaScript / jQuery Countdown to add milliseconds you get

var end = new Date('13 Apr 2012 13:30:00');

var _second = 1000;
var _minute = _second * 60;
var _hour = _minute * 60;
var _day = _hour *24;
var timer;

function showRemaining()
{
    var now = new Date();
    var distance = end - now;
    if (distance < 0 ) {
       // handle expiry here..
       clearInterval( timer ); // stop the timer from continuing ..
       //alert('Expired'); // alert a message that the timer has expired..
    }
    var days = Math.floor(distance / _day);
    var hours = Math.floor( (distance % _day ) / _hour );
    var minutes = Math.floor( (distance % _hour) / _minute );
    var seconds = Math.floor( (distance % _minute) / _second );
    var milliseconds = distance % _second;

    var countdownElement = document.getElementById('timer');
    countdownElement.innerHTML = days  + 'd ' +
                                 hours + 'h ' +
                                 minutes + 'm ' +
                                 seconds + 's ' +
                                 milliseconds + 'ms';
}

timer = setInterval(showRemaining, 10);

But it does not handle month and year as that needs more plex calculations to factor 28-31 day months and leap years..

Demo at http://jsfiddle/TaHtz/2/

Try this js fiddle: http://jsfiddle/QH6X8/185/

Set the end date with the end variable defined on the first line of the JavaScript.

If you don't want to update every 1 millisecond, then here is a jsfiddle updating every 60: http://jsfiddle/QH6X8/187/