5 ms·
Ken's Street Fighter II with animated sprites
- LandoCalrissian 14y agoNot just CSS3, but still very fun.
- carlsednaoui 14y agoIncredible! Here is more info as to how the author did this: http://front-back.com/2013/01/animate-png-sprites-with-css3-animations http://front-back.com/2013/01/animate-png-sprites-with-css3-...
- mckoss 14y agoVery nice (simple!) demo of using css keyframe animation of a sprite.
- president 14y agoDoesn't work on Chrome Version 24.0.1312.57 m (Win 7) EDIT: Works now, found out the pngs were being blocked on my network...
- nanodeath 14y agoHmm, works for me (Chrome 24.0.1312.57 m Win 7).
- crazygringo 14y agoI've never been an HN naysayer before... But this is just a trivial collection of CSS sprites and JavaScript. It isn't really CSS3 at all, or any different from what's been done a million times before. It just uses CSS animation instead of JavaScript for cycling through sprites, that's it.
- felipe_csl 14y agoNeverthless I still find it pretty impressive!
- cpayne 14y agoI guess in the end it depends on what you want to get out of hacker news. I can see your point, I think its just another clever implementation of what's out...
- nyg_hakeem 14y agoCVC seems broken. It returns true when I entered the wrong number.
- luney 14y agoNow I can finally do all the special moves whenever I want! FINALLY!
- pizarron 14y agoI don't know if everyone but me knew about Codepen before but I've found more impressive the fact that I can change any aspect of the work instantly than the animation itself.
- slantyyz 14y agoMy favorite part: If you execute a hadouken followed by a shoryuken or jump, the fireball moves up and down as Ken goes up and down. That would make for some awesome shenanigans if Ken had an opponent. edit: Kneel+walk also provide some interesting turtling possibilities too.
- sjs382 14y agoYeah, I coded something similar recently. Author should lock input while animating an action, or interrupt an action with a new one if necessary.
- oftenwrong 14y ago>This Site Totally Doesn't Work Without JavaScript. >Like, at all. Sorry. If you enable it and reload this page you'll be good to go. Need to know how? Go here. Finally, an honest no-js message.