Build a Street Fighter Demo with CSS Animations and JavaScript

This entry was posted by Friday, 15 February, 2013

I recently learned a cool technique from Simurai about how to animate PNG sprites with the CSS3 animations’ steps() property. The main idea in this technique is to “recreate” some kind of animated GIF but with the tiles of a PNG sprite.

As with everyone I know, I played to Street Fighter in my childhood and when I saw this … guess what popped in my head?

Check out this Pen!

(If the pen doesn’t render above, click here to see it in action.

Let’s Create the First CSS

Read Full Post at David Walsh :: Legendary scribbles about JavaScript, HTML5, AJAX, PHP, CSS, and ∞.