Animated Backgrounds

Berry de Vos has created a demo of how animated backgrounds (built with canvas) would work. The animated background consists of scrolling bars which slowly change angle and colour over time.

Still probably faster to use a GIF at the moment..

Still probably faster to use a GIF at the moment..

Berry has these hints on using a large canvas:

When I created the first setup for this demo I started by setting the height and width of the Canvas to the height and width of the page. This soon turned out to be quite heavy on the CPU usage at higher resolutions. So I made the Canvas a static size and let the browser resize the area to 100%. This works and performs way better.

Works best in Chrome.

View the Animated Backgrounds demo. You can also read about how he did it here.


Applications, Display
Berry de Vos
Posted on:
October 28th, 2009
Posted by:
Andi Smith



Your Rating:
1 Star2 Stars3 Stars4 Stars5 Stars

Works on

BETA Please let us know if you find Animated Backgrounds works in other browsers by leaving a comment below.



My computer is about 4 or 5 years old, but this runs amazingly fast on Chromium 2.0.

Posted on November 2, 2009


Works in Chrome 12.0.742 (of course html5 works smoothly in Chrome).

Posted on August 2, 2011

Add comment

(will not be published)