Play.js
Agnostic frame-skipping animation library
Performs an abstract transition for a fixed amount of time, regardless of the
frame rate of the page (frame skipping.) Calls an onFrame
callback with a
0-to-1 float ratio (representing the progress of the transition) as often as
the browser can perform.
// Run a transition for one secondPlaystart time: 1 { console; }; // A custom transition easing can be set using the "easing" option, otherwise// it defaults to linear.Playstart time: 01 { // Similar to the default jQuery "swing" easing ($.easing.swing) return 05 - Math / 2; } { // The first and last values will be closer, as the transition grows faster // in middle console; }; // Starting an animation returns a reference to its instance, exposing a few// API methodsvar myAnimation = Playstarttime: 5; // You can stop an animation at any time...Play;// ...or end it. The difference being that this time the onFrame handler will// also be called on last time, with maximum ratio (1), as if the entire time// for that animation had passedPlay; // Another thing you can do is start a transition from a specific point in its// development. This animation will go from 0.5 to 1 ratio and will last 500msPlaystarttime: 1 ratio: 05; // The beauty of the onFrame handler lays in its simplicity. You can use the// frame ratio in any way you'd like, from rendering a progress bar to all// sorts af complex DOM transitionsPlaystarttime: 5 { ;}; // Play.js can also be installed as a npm packagevar Play = Play;