Anima — tool for CSS3 Animations | Hacker News Reader

Anima — tool for CSS3 Animations

lvivski.github.com

41 pointslvivski7 comments

Looks really nice

honorable mention to other nice animation frameworks:

Move.js (http://visionmedia.github.com/move.js/) Transit.js (http://ricostacruz.com/jquery.transit/)

Yes, these libraries are very good, but they don't generate "@keyframes", Anima does in CSS mode.

And as far as I see they have no parallel animations like http://lvivski.github.com/anima/example/parallel.html. The ball moves forward with lenear timing-function, and up/down with ease-quad, so is slows down when on top and speeds up when falls down

Love the simplicity, the name and the presentation. I'll try it out right a way on a project, I was just getting to the part where I'd animate stuff with either jQuery or CSS3 and it looks like this will make it a breeze. Thanks!

Thanks for your feedback! You can post issues on github, if you have and troubles or questions.

Why does this framework treat css3 animations as though they have no interface with JavaScript events, or that animations can't be paused or stopped through CSS alone?

Pure CSS animations can be paused and resumed via Javascript. It's not trivial to stop them and preserve last known state of the node, and apply next animation so that is starts with that state.

Controling CSS Transitions is even more difficult and requires multiple actions like: remember current transform, remove transition, apply remembered transform etc.

Yes, CSS Animations have events for animation start and end, but Anima gives intermediate events, for any transformation in a set.

So it's not impossible to control CSS animations, but it's much easier with Anima. In `CSS` mode Anima has `pause()` `resume()` and `stop()` methods

It can do both: generate pure CSS Animations and animate items via Javascript, CSS 3d transforms and requestAnimationFrame.

Reply on news.ycombinator.com