Recently, I’ve bookmarked a bunch of animation-related scripts, libraries, and plugins. Although CSS3 has certainly made animation easier for us, sometimes we need a little bit of help.
There are other libraries that are more popular than these (like Raphaël.js), but these are some mostly lesser-known scripts that I’ve stumbled across in recent months.
prepareTransition (jQuery plugin)
“The prepareTransition plugin sets display and visibility to override any existing display and visibility properties. This ensures that the element can still animate without issue.”
This library helps you make “beautiful <canvas> and DOM animations”. Some demos provided include an animated graph, animating the GitHub mascot, and animated pie charts. Rekapi also allows you to export your DOM animations to CSS3 keyframes.
“GFX integrates CSS3 transforms and transitions into jQuery, making it stupidly simple to create sophisticated and gorgeous animations.” The main page has four cool examples.
This one seems quite complex, but looks mega-cool. It’s described as “a multi-instance director-based scene-graph manager [that] is able to render using Canvas, WebGL and CSS with the same code base.” Probably not for everyone, but an option for those looking for more fine-grained control over animations.
tQuery API (library)
This small library that mimics the jQuery API and works on top of three.js, helping developers have an easier time writing plugins based on three.js.
jCS Media Library (library)
jCS helps you “create complex animations that look the same on IE7+, Android, and iPhone/iPad”, without Flash, Silverlight, or HTML5.
jQuery Transit (jQuery plugin)
“Super-smooth CSS3 transformations and transitions for jQuery.” Lots of simple examples on the main page.
Greensock Tweening Platform
I just found this post discussing a library called Greensock:
Very impressive animation demonstrated right on that page.
And here’s a GitHub Wiki with some others:
Cool new library site called JSter, here is their animation libraries page:
This new framework apparently has animation capabilities:
Here’s another one called “Collie”:
Here is the manual with examples:
And Github link:
A site that already use it:
For any question:
Thank you so much for sharing) As you mentioned in your article there are libraries for WebGL technology like three.js. I found an article recently revealing more libraries – https://www.visartech.com/blog/interactive-3d-graphics-with-webgl/. Hope it will be useful. There are also more detailed information about an innovative technology like WebGL.