Megaman II’s Intro Animation In HTML

Created by yours truly. No Flash, just CSS, HTML5, and jQuery. The animation is very not smooth in Firefox, but works great in Safari and Chrome.

[You can check it out here.][link]

[link]: http://extrafuture.com/mm2/ “Megaman II Intro”

Using the scrollbar to bring the view upward was a stylistic choice, it could’ve just as (if not more) easily done in a single “screen”, but what’s the fun in that? The demo uses the jQuery [backgroundPosition-Effect][plugin] plugin to achieve the parallax scrolling effect, and the new Javascript audio capabilities introduced by the HTML5 group. The timing may not work very well on older machines.

[plugin]: http://plugins.jquery.com/project/backgroundPosition-Effect “jQuery Plugins: backgroundPosition-Effect”