ease
Easing functions (for canvas etc)
- linear
- inQuad
- outQuad
- inOutQuad
- inCube
- outCube
- inOutCube
- inQuart
- outQuart
- inOutQuart
- inQuint
- outQuint
- inOutQuint
- inSine
- outSine
- inOutSine
- inExpo
- outExpo
- inOutExpo
- inCirc
- outCirc
- inOutCirc
- inBack
- outBack
- inOutBack
- inBounce
- outBounce
- inOutBounce
Aliases
- in-quad
- out-quad
- in-out-quad
- in-cube
- out-cube
- in-out-cube
- in-quart
- out-quart
- in-out-quart
- in-quint
- out-quint
- in-out-quint
- in-sine
- out-sine
- in-out-sine
- in-expo
- out-expo
- in-out-expo
- in-circ
- out-circ
- in-out-circ
- in-back
- out-back
- in-out-back
- in-bounce
- out-bounce
- in-out-bounce
Example
var ease = ;var requestAnimationFrame = ;var canvas = document;var ctx = canvas; var stop = false; { if stop return; ; ;} var startx = 20;var x = startx;var destx = 300;var y = 400 / 2;var duration = 1000;var start = Date;var end = start + duration; { var now = Date; if now - start >= duration stop = true; var p = now - start / duration; val = ease; x = startx + destx - startx * val; canvaswidth = canvaswidth; ctxfillStyle = 'red'; ctx; ctx;} ;
License
MIT