- Speed: Shifty is optimized for performance.
- Playback control (play/pause/stop).
- Flexibility: Shifty provides numerous low-level APIs to hook into the animtion pipeline.
- Extensibility: Shifty's
Tweenableobject works well as the base in a prototype chain.
- Small download size: The standard distribution (which includes all extensions) is less than 4Kb when minified and gzipped. The core of the library (
shifty.core.js) is less than 2Kb when minified and gzipped.
Shifty is a low-level animation solution. This means that it does not perform any rendering, but it can be integrated into whatever rendering mechanism is most appropriate for your project. Shifty is meant to be a simpler, more lightweight and flexible alternative to richer tools like the excellent GreenSock animation platform. While GreenSock edges it out in raw performance comparisons, Shifty's performance is quite good and offers a simpler, smaller package. This can be critical for some projects, particularly on mobile devices. Just ask Yelp.
If used without an AMD or CommonJS script loader, Shifty exposes only one object globally:
Tweenable. To create a basic tween, you could have something like this:
This snippet tweens and prints the
x variable from 0 to 10 over one second, and then prints the final value. You can animate as many properties in a single tween as you'd like.
numbers. The standard distribution of Shifty provides support for CSS strings and is capable of animating DOM elements. All of this functionality is described in detail in the API documentation and project README.
A collection of Robert Penner's easing functions have been adapted for use with Shifty and are included in the standard distribution.
Please fork, use and contribute to Shifty! It is distributed under the MIT License, and experimentation is encouraged. If you find a bug or have a question about Shifty, please submit it via the Github issue tracker.