Settings

Theme

Ken's Street Fighter II with animated sprites

codepen.io

55 points by dustinlakin 13 years ago · 14 comments

Reader

crazygringo 13 years ago

I'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 13 years ago

    Neverthless I still find it pretty impressive!

  • cpayne 13 years ago

    I 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...

carlsednaoui 13 years ago

Incredible! Here is more info as to how the author did this: http://front-back.com/2013/01/animate-png-sprites-with-css3-...

  • mckoss 13 years ago

    Very nice (simple!) demo of using css keyframe animation of a sprite.

slantyyz 13 years ago

My 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 13 years ago

    Yeah, I coded something similar recently. Author should lock input while animating an action, or interrupt an action with a new one if necessary.

oftenwrong 13 years 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.

pizarron 13 years ago

I 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.

president 13 years ago

Doesn'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...

luney 13 years ago

Now I can finally do all the special moves whenever I want! FINALLY!

LandoCalrissian 13 years ago

Not just CSS3, but still very fun.

nyg_hakeem 13 years ago

CVC seems broken. It returns true when I entered the wrong number.

Keyboard Shortcuts

j
Next item
k
Previous item
o / Enter
Open selected item
?
Show this help
Esc
Close modal / clear selection