#Easing

5/12/2016 - 7:14 AM


EaseIn = function(power){return function(t){return Math.pow(t, power)}};
EaseOut = function(power){return function(t){return 1 - Math.abs(Math.pow(t-1, power))}};
EaseInOut = function(power){return function(t){return t<.5 ? EaseIn(power)(t*2)/2 : EaseOut(power)(t*2 - 1)/2+0.5}}

SimpleEasing.js

/*
 * Easing Functions - inspired from http://gizma.com/easing/
 * only considering the t value for the range [0, 1] => [0, 1]
 */
EasingFunctions = {
  // no easing, no acceleration
  linear: function (t) { return t },
  // accelerating from zero velocity
  easeInQuad: function (t) { return t*t },
  // decelerating to zero velocity
  easeOutQuad: function (t) { return t*(2-t) },
  // acceleration until halfway, then deceleration
  easeInOutQuad: function (t) { return t<.5 ? 2*t*t : -1+(4-2*t)*t },
  // accelerating from zero velocity 
  easeInCubic: function (t) { return t*t*t },
  // decelerating to zero velocity 
  easeOutCubic: function (t) { return (--t)*t*t+1 },
  // acceleration until halfway, then deceleration 
  easeInOutCubic: function (t) { return t<.5 ? 4*t*t*t : (t-1)*(2*t-2)*(2*t-2)+1 },
  // accelerating from zero velocity 
  easeInQuart: function (t) { return t*t*t*t },
  // decelerating to zero velocity 
  easeOutQuart: function (t) { return 1-(--t)*t*t*t },
  // acceleration until halfway, then deceleration
  easeInOutQuart: function (t) { return t<.5 ? 8*t*t*t*t : 1-8*(--t)*t*t*t },
  // accelerating from zero velocity
  easeInQuint: function (t) { return t*t*t*t*t },
  // decelerating to zero velocity
  easeOutQuint: function (t) { return 1+(--t)*t*t*t*t },
  // acceleration until halfway, then deceleration 
  easeInOutQuint: function (t) { return t<.5 ? 16*t*t*t*t*t : 1+16*(--t)*t*t*t*t }
  // elastic bounce effect at the beginning
  easeInElastic: function (t) { return (.04 - .04 / t) * Math.sin(25 * t) + 1 },
  // elastic bounce effect at the end
  easeOutElastic: function (t) { return .04 * t / (--t) * Math.sin(25 * t) },
  // elastic bounce effect at the beginning and end
  easeInOutElastic: function (t) { return (t -= .5) < 0 ? (.02 + .01 / t) * Math.sin(50 * t) : (.02 - .01 / t) * Math.sin(50 * t) + 1 }

}

Quint.java

class Quint {
	
	float easeIn (float t,float b , float c, float d) {
		return c*(t/=d)*t*t*t*t + b;
	}
	
	float easeOut (float t,float b , float c, float d) {
		return c*((t=t/d-1)*t*t*t*t + 1) + b;
	}
	
	float easeInOut (float t,float b , float c, float d) {
		if ((t/=d/2) < 1) return c/2*t*t*t*t*t + b;
		return c/2*((t-=2)*t*t*t*t + 2) + b;
	}
	
}

Quart.java

class Quart {
	
	float  easeIn(float t,float b , float c, float d) {
		return c*(t/=d)*t*t*t + b;
	}
	
	float  easeOut(float t,float b , float c, float d) {
		return -c * ((t=t/d-1)*t*t*t - 1) + b;
	}
	
	float  easeInOut(float t,float b , float c, float d) {
		if ((t/=d/2) < 1) return c/2*t*t*t*t + b;
		return -c/2 * ((t-=2)*t*t*t - 2) + b;
	}
	
}

Linear.java

class Linear {
	
	float easeNone (float t,float b , float c, float d) {
		return c*t/d + b;
	}
	
	float easeIn (float t,float b , float c, float d) {
		return c*t/d + b;
	}
	
	float easeOut (float t,float b , float c, float d) {
		return c*t/d + b;
	}
	
	float easeInOut (float t,float b , float c, float d) {
		return c*t/d + b;
	}
	
}

Expo.java

class Expo {
	
	float  easeIn(float t,float b , float c, float d) {
		return (t==0) ? b : c * (float)Math.pow(2, 10 * (t/d - 1)) + b;
	}
	
	float  easeOut(float t,float b , float c, float d) {
		return (t==d) ? b+c : c * (-(float)Math.pow(2, -10 * t/d) + 1) + b;	
	}
	
	float  easeInOut(float t,float b , float c, float d) {
		if (t==0) return b;
		if (t==d) return b+c;
		if ((t/=d/2) < 1) return c/2 * (float)Math.pow(2, 10 * (t - 1)) + b;
		return c/2 * (-(float)Math.pow(2, -10 * --t) + 2) + b;
	}

}

Sine.java

class Sine {
	
	float  easeIn(float t,float b , float c, float d) {
		return -c * (float)Math.cos(t/d * (Math.PI/2)) + c + b;
	}
	
	float  easeOut(float t,float b , float c, float d) {
		return c * (float)Math.sin(t/d * (Math.PI/2)) + b;	
	}
	
	float  easeInOut(float t,float b , float c, float d) {
		return -c/2 * ((float)Math.cos(Math.PI*t/d) - 1) + b;
	}
	
}

Quad.java

class Quad {
	
  float  easeIn(float t,float b , float c, float d) {
		return c*(t/=d)*t + b;
	}
	
	float  easeOut(float t,float b , float c, float d) {
		return -c *(t/=d)*(t-2) + b;
	}
	
	float  easeInOut(float t,float b , float c, float d) {
		if ((t/=d/2) < 1) return c/2*t*t + b;
		return -c/2 * ((--t)*(t-2) - 1) + b;
	}
	
}

Elastic.java

class Elastic {

	float  easeIn(float t,float b , float c, float d ) {
		if (t==0) return b;  if ((t/=d)==1) return b+c;  
		float p=d*.3f;
		float a=c; 
		float s=p/4;
		return -(a*(float)Math.pow(2,10*(t-=1)) * (float)Math.sin( (t*d-s)*(2*(float)Math.PI)/p )) + b;
	}

	float  easeIn(float t,float b , float c, float d, float a, float p) {
		float s;
		if (t==0) return b;  if ((t/=d)==1) return b+c;  
		if (a < Math.abs(c)) { a=c;  s=p/4; }
		else { s = p/(2*(float)Math.PI) * (float)Math.asin (c/a);}
		return -(a*(float)Math.pow(2,10*(t-=1)) * (float)Math.sin( (t*d-s)*(2*Math.PI)/p )) + b;
	}

	float  easeOut(float t,float b , float c, float d) {
		if (t==0) return b;  if ((t/=d)==1) return b+c;  
		float p=d*.3f;
		float a=c; 
		float s=p/4;
		return (a*(float)Math.pow(2,-10*t) * (float)Math.sin( (t*d-s)*(2*(float)Math.PI)/p ) + c + b);	
	}
	
	float  easeOut(float t,float b , float c, float d, float a, float p) {
		float s;
		if (t==0) return b;  if ((t/=d)==1) return b+c;  
		if (a < Math.abs(c)) { a=c;  s=p/4; }
		else { s = p/(2*(float)Math.PI) * (float)Math.asin (c/a);}
		return (a*(float)Math.pow(2,-10*t) * (float)Math.sin( (t*d-s)*(2*(float)Math.PI)/p ) + c + b);	
	}
	
	float  easeInOut(float t,float b , float c, float d) {
		if (t==0) return b;  if ((t/=d/2)==2) return b+c; 
		float p=d*(.3f*1.5f);
		float a=c; 
		float s=p/4;
		if (t < 1) return -.5f*(a*(float)Math.pow(2,10*(t-=1)) * (float)Math.sin( (t*d-s)*(2*(float)Math.PI)/p )) + b;
		return a*(float)Math.pow(2,-10*(t-=1)) * (float)Math.sin( (t*d-s)*(2*(float)Math.PI)/p )*.5f + c + b;
	}
	
	float  easeInOut(float t,float b , float c, float d, float a, float p) {
		float s;
		if (t==0) return b;  if ((t/=d/2)==2) return b+c;  
		if (a < Math.abs(c)) { a=c; s=p/4; }
		else { s = p/(2*(float)Math.PI) * (float)Math.asin (c/a);}
		if (t < 1) return -.5f*(a*(float)Math.pow(2,10*(t-=1)) * (float)Math.sin( (t*d-s)*(2*(float)Math.PI)/p )) + b;
		return a*(float)Math.pow(2,-10*(t-=1)) * (float)Math.sin( (t*d-s)*(2*(float)Math.PI)/p )*.5f + c + b;
	}

}

Cubic.java

public class Cubic {
	
	public static float easeIn (float t,float b , float c, float d) {
		return c*(t/=d)*t*t + b;
	}
	
	public static float easeOut (float t,float b , float c, float d) {
		return c*((t=t/d-1)*t*t + 1) + b;
	}
	
	public static float easeInOut (float t,float b , float c, float d) {
		if ((t/=d/2) < 1) return c/2*t*t*t + b;
		return c/2*((t-=2)*t*t + 2) + b;
	}

}

Circ.java


public class Circ {
	
	public static float  easeIn(float t,float b , float c, float d) {
		return -c * ((float)Math.sqrt(1 - (t/=d)*t) - 1) + b;
	}
	
	public static float  easeOut(float t,float b , float c, float d) {
		return c * (float)Math.sqrt(1 - (t=t/d-1)*t) + b;
	}
	
	public static float  easeInOut(float t,float b , float c, float d) {
		if ((t/=d/2) < 1) return -c/2 * ((float)Math.sqrt(1 - t*t) - 1) + b;
		return c/2 * ((float)Math.sqrt(1 - (t-=2)*t) + 1) + b;
	}

}

Bounce.java

class Bounce {
	
  float  easeIn(float t,float b , float c, float d) {
		return c - easeOut (d-t, 0, c, d) + b;
	}
	
	float  easeOut(float t,float b , float c, float d) {
		if ((t/=d) < (1/2.75f)) {
			return c*(7.5625f*t*t) + b;
		} else if (t < (2/2.75f)) {
			return c*(7.5625f*(t-=(1.5f/2.75f))*t + .75f) + b;
		} else if (t < (2.5/2.75)) {
			return c*(7.5625f*(t-=(2.25f/2.75f))*t + .9375f) + b;
		} else {
			return c*(7.5625f*(t-=(2.625f/2.75f))*t + .984375f) + b;
		}
	}
	
	float  easeInOut(float t,float b , float c, float d) {
		if (t < d/2) return easeIn (t*2, 0, c, d) * .5f + b;
		else return easeOut (t*2-d, 0, c, d) * .5f + c*.5f + b;
	}

}

#Easing

_
returns a float value

t = current time 
b = beginning value
c = change (end value)
d = duration

Cacher is the code snippet organizer for pro developers

We empower you and your team to get more done, faster

#Easing