Animating with canvas and creating CSS3 animations with JavaScript

Yesterday we went to a cool park in Krakow, Poland where they have all kind of physics experiments for kids (and me): One of the things that always fascinated me was the optical illusion of non-concentric circles turning into a 3D cone. Take the following picture: And then rotate it and you see what I mean (video on screenr). This seems to work nicely, try it in Opera and in other browsers to see the differences and get information what kind of animation was used. If I used transformation instead of animation it would even be easier. As it stands now, you can’t access, create and change keyframes that easily. this post has some more info on the issue and Joe Lambert did another showcase. Makes you wonder if we shouldn’t create an easier bridge between JS and CSS animations. Tags: animation, canvas, css, javascript