Tweene

JavaScript Animation Proxy

There are already a lot of good JavaScript animation libraries on the market, each one with specific features, strengths and weaknesses. Each programmer and each project have their specific requirements, so sometimes one library may be suitable while other times it could not. We don't want to encourage you to change your favourite library, and we have not written another one of them.

Tweene [twiːni] is something different. It is an animation proxy: used as a wrapper of your chosen library, it may allow you to do more and better and it makes easy to switch from one library to another any time you want. Currently it can work together with GSAP, Velocity.js, Transit (CSS transitions) or jQuery.

Check out the features

  • One API to rule them all

    Switching to another library and learning a new interface takes a lot of time.

    Is it 'x' or 'translateX'? Do I have to pass time values in seconds or ms?

    Never mind anymore! Tweene handles all this stuff for you with a versatile interface that adapts itself to your needs and programming style. You could potentially run a desktop version with one library and the mobile version with another one with NO changes at all in your animation code.

  • Timelines to the masses

    Through Tweene we have added Timeline feature to all supported libraries (only GSAP has native support for it), a powerful and easy way for organize your animation sequencing.

    • No more deep nesting of code inside complete callbacks
    • No more going mad with promises
    • No more setTimeout garbage in your code

    Organize your sequence like a boss with Tweene timelines.

  • Power is nothing without control

    With Tweene you have now play(), pause(), resume(), reverse() and restart() methods for all supported libraries, for both tweens and timelines.
    You can also control CSS Transition based tweens, honoring easing.

    You can change the speed too while running, gaining great slow-mo or fast-forward effects.

And more...

To, From and FromTo tweens, loops and infinite loops, yoyo effect, delay and loops delay, callbacks and directional callbacks, full set of events (start, repeat, complete, reverse and progress), register macros for common actions, easy syntax for property-based easing, generic or single target dedicated timelines, easy benchmarking of different libraries performance using the same code for all. Check Docs and Examples for a full list of features or take a look directly at source code on GitHub.

Demos

Download

Tweene is available under Artistic License 2.0, check the LICENSE.txt inside the archive for details.
Animation libraries of your choice are not included and have their own license agreement.

You can also use it with package managers:

npm install tweene  or  bower install tweene