Google+

JS4Nubs: Real-time Hit Counter

This is my first post in a series called 4Nubs. Which is basically programming tutorials for noobs. So, here I go... Tell me what you think.

If you use GMail, or if you’ve ever been to GMail.com, you’ll know that they have this cool ad for their huge storage space. It’s a number that goes up continuously. Google wants you to think that you’re gaining storage space continuously.

Image: Capture.PNG

But what seems like a second-by-second increase of mailbox quota, is actually a simple JavaScript trick. If you look into the source code, there is a timer that increments the number every 1000 milliseconds. So here, we’re going to imitate that effect, but in a simpler way.

Say, I wanted to make a hit-counter that would update itself automatically. So, I figure out that I get 1 visitor every 23 seconds. (It’s actually a lot less )

So, here’s what I would do:

First, lets layout my new magic hit counter.

You are visitor number <span id="hitcounter"></span>.

That’s it for the layout. Now for the JavaScript:

<script type="text/javascript">
var delay=23000; //Time in milliseconds
var startvalue=400; //What number to start with

function increment(){
document.getElementById("hitcounter").innerHTML = startvalue;
startvalue++;
setTimeout("increment()",delay);
}

window.onload=increment;
}
</script>

So, every 23 seconds, the hit counter will go up by one. But to get the number of hits that have already passed, you’ll need some more programming.. Hmm. So I guess this isn’t really useful.

Oh well.
Bye

-Roger

1 CommentAdd one

iamnotjamesh
Sat, 05 Dec 2009 07:56:40 GMT

gmail is increasing storage at like .000000000000001 bytes per sec!

Post a Comment

Mon, 30 Dec 2024 17:52:38 GMT