This is my first little javascript animation in plan for buildign a 2d game. This program uses the canvas tag, and loads a smiling face image. The image is hand drawn using Photoshop, and is a PNG with a transparent background. The movememnt is controlled by a javascript object, which adds a vector, checks for the edges of the canvas (a 300pxX300px image) and reverses direction upon hitting the edge.
The javascript draw function is called every millisecond, and the ball's position is updated each 'frame'. This is pretty slow on the iPod Touch and android phone browsers, but looks pretty fast in Chrome and Firefox. It doesn't work at all in IE. The speed of the ball is very very dependent on the speed of the javascript implemetation, which is one of the problems with it. One of my next tests will be to use a timing object -- if I continue down this path. I'm not sure it's necessary, or desired though.
This entire animation, for instance, can be done with javascript and no canvas at all.