HTML5 Button

I present to you the HTML 5 rendition of this flash button:

Note that this page was designed for the latest nightly build of Mozilla Firefox. You can get a copy of Minefield at the Nightly Builds page. I especially recommend the 64-bit version if you're on a 64-bit operating system, so you can make full use of your processor's capabilities and understand firsthand that Adobe Flash is inferior technology.

• Normal: Standard Button. Blue gradient BG. Aqua text.
• Hover:
  • Part 1: Text moves Left, background color moves to white.
  • Part 2: Text moves Right and gets white shadow, background color returns and adds animation.
• Out:
  • Part 1: text moves Left with no shadow, background color moves to white.
  • Part 2: text moves Right, back to blue gradient background with aqua text.

There are some issues in the current Minefield release that keep HTML 5 from its full potential.
Currently this does not use CSS Animations, which would make the entire process a lot simpler. It can still be done without them, though! Thank you JavaScript.
Also, Firefox currently has a little bug where any background-image GIF does not load the full animation unless a copy of the same GIF is on the page normally.

Finally, the transition property background-image, which would transition one gradient to another over time, is currently not implemented in the browser, although this button as written will handle it once it is.
Hopefully, a full implementation of HTML 5 and CSS 3 will make this button much more graceful, simple, and browser-universal.