And here comes another useless but cool HTML 5 effect (See also: Water ripple effect done in HTML 5 and Snow effect done in HTML 5), the good old starfield animation you knew and loved from the old Windows 95 screen saver:
The algorithm is incredibly easy, the stars have a position and a size, and you just calculate starPosition += (starPosition – canvasCenter) * starSize and voila, the star moves according to its size (proximity to the screen) and position more or less realistically, no 3D calculations needed.
I discovered this algorithm a long time ago while playing around in Flash and now i finally built it in HTML 5.
The star drawing is done by drawing lines, this is slower than using a pre-drawn circle canvas, but it adds a bit more realism to the animation since the line is drawn between the old and newly calculated star position, which creates a much more visible movement of the stars.
Enough yapping, here is the code, just open it in a browser: Starfield animation in HTML5
If you are using this on your website and you are a nice person you can show it by giving me a credit (backlink) somewhere on your page, thank you!