I saw the recent announcement by Paul Rouget that Firefox 4 beta 2 has support for CSS transitions and I thought it would be fun to play with it.

Here is a demo with complete source code where I chained together a bunch of CSS transitions using the transitionend event to trigger the transitions sequentially.

DEMO CSS transitions in Firefox 4 beta 2

The demo requires Firefox 4 beta 2

I found that the transitionend event was triggered more often then I expected and had to remove listeners for the event when I was done with them or they sometimes triggered again. I need to learn more about what triggers them.

Have fun with the code as that is the best way to learn.