Continuous countup timer (independent of page load)

Question

I'm trying to create a continuously increasing number on my site that starts at a given number (5,000,000 for instance) and increases at an even rate (of about 1 per sec or so) to infinity. This should happen independent of the user loading the webpage -- in other words, the timer should NOT restart at 5,000,000 every time you load the webpage. It would instead show the new higher number.

I was thinking the easiest way (in my very limited knowledge on the subject) might be to use a previous date as a starting point and count the seconds elapsed from that date. That way it would be accurate no matter when you load the page and would increase at 1 per second.

Any ideas?

Answer 1

var initSeconds = new Date(2010, 0).getSeconds() //january 1 of 2010
    , BASE_NUMBER = 5000000
;

setInterval(function() {
   var curSeconds = new Date().getSeconds()
       , elem = $('#mydisplayelem')
   ;
   elem.text(BASE_NUMBER + curSeconds - initSeconds);
}, 1000);

Something along these lines... this won't do exactly what you want, you need a better time calculation, but this should get you started.

Also, see this article about calculating date diffs.