EasingJS README (0.1.x)¶

Overview¶

Easing is a JavaScript port of Robert Penner's easing algorithms for ActionScript. The latest version of this library is always available online at the following URL:

http://pablotron.org/software/easing-js

Using EasingJS¶

You can use this library in an object-oriented (OOP) or procedural manner. Here's an object-oriented example:

// create new quadratic easer
var e = new Easing.Easer({
  type: 'quadratic',
  side: 'both'
});

// calculate ease at 50 out of 100 time units 
// for a tween from 10 to 300 
var x = e.ease(50, 10, 290, 100);

And here's the same result, using the procedural API:

// calculate ease at 50 out of 100 time units 
// for a tween from 10 to 300
var x = Easing.quadratic.ease_both(50, 10, 290, 100);

A test page which allows you to try the various side and type combinations is available in the test/ directory, or online at the following URL:

http://pablotron.org/software/easing-js/test/

EasingJS Modes¶

Available easing types:

• bounce: Bounce easing.
• circular: Circular easing.
• cubic: Cubic (x^3) easing.
• elastic: Elastic easing.
• exp: Exponential (2^x) easing.
• linear: Linear easing (default).
• quadratic: Quadratic (x^2) easing.
• quartic: Quartic (x^4) easing
• quintic: Quintic (x^5) easing.
• sine: Sinusoidal (cos(x)) easing.

Available easing sides:

• none: Don't ease either side (default).
• both: Ease both sides.
• in: Ease in.
• out: Ease out.