Animated Rocket with jQuery and CSS transform

The examples on this page will work properly in Safari, Chrome and Opera. In the Firefox prior to version 4 you will see the transforms, but without any animation. Some effects may also work now in Internet Explorer 9 if you use the -ms- vendor prefix.

The implementation of animation in CSS involves setting up a transformation to take place in response to a mouseover or other event. Then, rather than applying the effect instantly, we assign a transition timing function which applies the transformation/s over a set time period.