VEGAS JS Namespace: easings

The system.transitions package use the core.easings library who contains all the easing functions to create the specific tweening effects.

These easings functions provide different flavors of math-based motion under a consistent API.

easing	description	in	out	inout
linear	simple linear tweening : no easing, no acceleration	-	-	-
back	back easing : overshooting cubic easing: (s+1)t^3 - st^2	yes	yes	yes
bounce	bounce easing : exponentially decaying parabolic bounce	yes	yes	yes
circular	circular easing : sqrt(1-t^2)	yes	yes	yes
cubic	cubic easing : t^3	yes	yes	yes
elastic	elastic easing : exponentially decaying sine wave	yes	yes	yes
expo	exponential easing : 2^t	yes	yes	yes
quad	quadratic easing : t^2	yes	yes	yes
quartic	quartic easing : t^4	yes	yes	yes
quintic	quintic easing : t^5	yes	yes	yes
regular	regular easing	yes	yes	yes
sine	sinusoidal easing : sin(t)	yes	yes	yes

License:

MPL 2.0 / GPL 2.0 / LGPL 2.1

Tutorials:

system.transitions

See:

system.transition library

Methods

backIn(t, b, c, d [, s])

The backIn function starts the motion by backtracking and then reversing direction and moving toward the target.

Parameters:

Name	Type	Argument	Default	Description
`t`	number			Specifies the current time, between 0 and duration inclusive.
`b`	number			Specifies the initial value of the animation property.
`c`	number			Specifies the total change in the animation property.
`d`	number			Specifies the duration of the motion.
`s`	number	<optional>	1.70158	Specifies the amount of overshoot, where the higher the value, the greater the overshoot.

Returns:

The value of the interpolated property at the specified time.

Type: number

backInOut(t, b, c, d [, s])

The backInOut method combines the motion of the backIn and backOut methods

Parameters:

Name	Type	Argument	Default	Description
`t`	number			Specifies the current time, between 0 and duration inclusive.
`b`	number			Specifies the initial value of the animation property.
`c`	number			Specifies the total change in the animation property.
`d`	number			Specifies the duration of the motion.
`s`	number	<optional>	1.70158	Specifies the amount of overshoot, where the higher the value, the greater the overshoot.

Returns:

The value of the interpolated property at the specified time.

backOut(t, b, c, d [, s])

The backIn function starts the motion by moving towards the target, overshooting it slightly,

Parameters:

Name	Type	Argument	Default	Description
`t`	number			Specifies the current time, between 0 and duration inclusive.
`b`	number			Specifies the initial value of the animation property.
`c`	number			Specifies the total change in the animation property.
`d`	number			Specifies the duration of the motion.
`s`	number	<optional>	1.70158	Specifies the amount of overshoot, where the higher the value, the greater the overshoot.

Returns:

The value of the interpolated property at the specified time.

bounceIn(t, b, c, d)

The bounceIn function starts the bounce motion slowly and then accelerates motion as it executes.

Parameters:

Name	Type	Description
`t`	number	Specifies the current time, between 0 and duration inclusive.
`b`	number	Specifies the initial value of the animation property.
`c`	number	Specifies the total change in the animation property.
`d`	number	Specifies the duration of the motion.

Returns:

The value of the interpolated property at the specified time.

bounceInOut(t, b, c, d)

The bounceInOut function combines the motion of the bounceIn and bounceOut functions

Parameters:

Name	Type	Description
`t`	number	Specifies the current time, between 0 and duration inclusive.
`b`	number	Specifies the initial value of the animation property.
`c`	number	Specifies the total change in the animation property.
`d`	number	Specifies the duration of the motion.

Returns:

The value of the interpolated property at the specified time.

bounceOut(t, b, c, d)

The bounceOut function starts the bounce motion fast and then decelerates motion as it executes.

Parameters:

Name	Type	Description
`t`	number	Specifies the current time, between 0 and duration inclusive.
`b`	number	Specifies the initial value of the animation property.
`c`	number	Specifies the total change in the animation property.
`d`	number	Specifies the duration of the motion.

Returns:

The value of the interpolated property at the specified time.

circularIn(t, b, c, d)

The circularIn function starts motion from zero velocity and then accelerates motion as it executes.

Parameters:

Name	Type	Description
`t`	number	Specifies the current time, between 0 and duration inclusive.
`b`	number	Specifies the initial value of the animation property.
`c`	number	Specifies the total change in the animation property.
`d`	number	Specifies the duration of the motion.

Returns:

The value of the interpolated property at the specified time.

circularInOut(t, b, c, d)

The circularInOut function combines the motion of the circularIn and circularOut methods to start the motion from a zero velocity, accelerate motion, then decelerate to a zero velocity.

Parameters:

Name	Type	Description
`t`	number	Specifies the current time, between 0 and duration inclusive.
`b`	number	Specifies the initial value of the animation property.
`c`	number	Specifies the total change in the animation property.
`d`	number	Specifies the duration of the motion.

Returns:

The value of the interpolated property at the specified time.

circularOut(t, b, c, d)

The circularOut function starts motion fast and then decelerates motion to a zero velocity as it executes.

Parameters:

Name	Type	Description
`t`	number	Specifies the current time, between 0 and duration inclusive.
`b`	number	Specifies the initial value of the animation property.
`c`	number	Specifies the total change in the animation property.
`d`	number	Specifies the duration of the motion.

Returns:

The value of the interpolated property at the specified time.

cubicIn(t, b, c, d)

The cubicIn function starts motion from zero velocity and then accelerates motion as it executes.

Parameters:

Name	Type	Description
`t`	number	Specifies the current time, between 0 and duration inclusive.
`b`	number	Specifies the initial value of the animation property.
`c`	number	Specifies the total change in the animation property.
`d`	number	Specifies the duration of the motion.

Returns:

The value of the interpolated property at the specified time.

cubicInOut(t, b, c, d)

The cubicOut function combines the motion of the cubicIn and cubicOut functions to start the motion from a zero velocity, accelerate motion, then decelerate to a zero velocity.

A cubic equation is based on the power of three : p(t) = t * t * t.

Parameters:

Name	Type	Description
`t`	number	Specifies the current time, between 0 and duration inclusive.
`b`	number	Specifies the initial value of the animation property.
`c`	number	Specifies the total change in the animation property.
`d`	number	Specifies the duration of the motion.

Returns:

The value of the interpolated property at the specified time.

cubicOut(t, b, c, d)

The cubicOut function starts motion fast and then decelerates motion to a zero velocity as it executes.

A cubic equation is based on the power of three : p(t) = t * t * t.

Parameters:

Name	Type	Description
`t`	number	Specifies the current time, between 0 and duration inclusive.
`b`	number	Specifies the initial value of the animation property.
`c`	number	Specifies the total change in the animation property.
`d`	number	Specifies the duration of the motion.

Returns:

The value of the interpolated property at the specified time.

elasticIn(t, b, c, d [, a] [, p])

The elasticIn function starts motion from zero velocity and then accelerates motion as it executes.

Parameters:

Name	Type	Argument	Default	Description
`t`	number			Specifies the current time, between 0 and duration inclusive.
`b`	number			Specifies the initial value of the animation property.
`c`	number			Specifies the total change in the animation property.
`d`	number			Specifies the duration of the motion.
`a`	number	<optional>	0	Specifies the amplitude of the sine wave.
`p`	number	<optional>	0	Specifies the period of the sine wave.

Returns:

The value of the interpolated property at the specified time.

elasticInOut(t, b, c, d [, a] [, p])

The elasticInOut function combines the motion of the elasticIn and elasticOut methods to start the motion from a zero velocity, accelerate motion, then decelerate to a zero velocity.

Parameters:

Name	Type	Argument	Default	Description
`t`	number			Specifies the current time, between 0 and duration inclusive.
`b`	number			Specifies the initial value of the animation property.
`c`	number			Specifies the total change in the animation property.
`d`	number			Specifies the duration of the motion.
`a`	number	<optional>	0	Specifies the amplitude of the sine wave.
`p`	number	<optional>	0	Specifies the period of the sine wave.

Returns:

The value of the interpolated property at the specified time.

elasticOut(t, b, c, d [, a] [, p])

The elasticOut function starts motion fast and then decelerates motion to a zero velocity as it executes.

Parameters:

Name	Type	Argument	Default	Description
`t`	number			Specifies the current time, between 0 and duration inclusive.
`b`	number			Specifies the initial value of the animation property.
`c`	number			Specifies the total change in the animation property.
`d`	number			Specifies the duration of the motion.
`a`	number	<optional>	0	Specifies the amplitude of the sine wave.
`p`	number	<optional>	0	Specifies the period of the sine wave.

Returns:

The value of the interpolated property at the specified time.

expoIn(t, b, c, d)

The expoIn function starts motion from zero velocity and then accelerates motion as it executes. The exponential functions is based on the number 2 raised to a multiple of 10 : p(t) = 2^10(t-1)

Parameters:

Name	Type	Description
`t`	number	Specifies the current time, between 0 and duration inclusive.
`b`	number	Specifies the initial value of the animation property.
`c`	number	Specifies the total change in the animation property.
`d`	number	Specifies the duration of the motion.

Returns:

The value of the interpolated property at the specified time.

expoInOut(t, b, c, d)

The expoInOut function combines the motion of the expoIn and expoOut() methods to start the motion from a zero velocity, accelerate motion, then decelerate to a zero velocity. The exponential functions is based on the number 2 raised to a multiple of 10 : p(t) = 2^10(t-1)

Parameters:

Name	Type	Description
`t`	number	Specifies the current time, between 0 and duration inclusive.
`b`	number	Specifies the initial value of the animation property.
`c`	number	Specifies the total change in the animation property.
`d`	number	Specifies the duration of the motion.

Returns:

The value of the interpolated property at the specified time.

expoOut(t, b, c, d)

The expoOut function starts motion fast and then decelerates motion to a zero velocity as it executes. The exponential functions is based on the number 2 raised to a multiple of 10 : p(t) = 2^10(t-1)

Parameters:

Name	Type	Description
`t`	number	Specifies the current time, between 0 and duration inclusive.
`b`	number	Specifies the initial value of the animation property.
`c`	number	Specifies the total change in the animation property.
`d`	number	Specifies the duration of the motion.

Returns:

The value of the interpolated property at the specified time.

linear(t, b, c, d)

The linear function starts a basic and linear motion.

Parameters:

Name	Type	Description
`t`	number	Specifies the current time, between 0 and duration inclusive.
`b`	number	Specifies the initial value of the animation property.
`c`	number	Specifies the total change in the animation property.
`d`	number	Specifies the duration of the motion.

Returns:

The value of the interpolated property at the specified time.

quarticIn(t, b, c, d)

The quarticIn function starts motion from zero velocity and then accelerates motion as it executes. A quartic equation is based on the power of four : p(t) = t * t * t * t

Parameters:

Name	Type	Description
`t`	number	Specifies the current time, between 0 and duration inclusive.
`b`	number	Specifies the initial value of the animation property.
`c`	number	Specifies the total change in the animation property.
`d`	number	Specifies the duration of the motion.

Returns:

The value of the interpolated property at the specified time.

quarticInOut(t, b, c, d)

The quarticInOut function combines the motion of the quarticIn and quarticOut methods to start the motion from a zero velocity, accelerate motion, then decelerate to a zero velocity. A quartic equation is based on the power of four : p(t) = t * t * t * t

Parameters:

Name	Type	Description
`t`	number	Specifies the current time, between 0 and duration inclusive.
`b`	number	Specifies the initial value of the animation property.
`c`	number	Specifies the total change in the animation property.
`d`	number	Specifies the duration of the motion.

Returns:

The value of the interpolated property at the specified time.

quarticOut(t, b, c, d)

The quarticOut function starts motion fast and then decelerates motion to a zero velocity as it executes. A quartic equation is based on the power of four : p(t) = t * t * t * t

Parameters:

Name	Type	Description
`t`	number	Specifies the current time, between 0 and duration inclusive.
`b`	number	Specifies the initial value of the animation property.
`c`	number	Specifies the total change in the animation property.
`d`	number	Specifies the duration of the motion.

Returns:

The value of the interpolated property at the specified time.

quintic(t, b, c, d)

The quinticIn function starts motion from zero velocity and then accelerates motion as it executes. A quintic easing continues the upward trend, raises time to the fifth power : p(t) = t * t * t * t * t

Parameters:

Name	Type	Description
`t`	number	Specifies the current time, between 0 and duration inclusive.
`b`	number	Specifies the initial value of the animation property.
`c`	number	Specifies the total change in the animation property.
`d`	number	Specifies the duration of the motion.

Returns:

The value of the interpolated property at the specified time.

quinticInOut(t, b, c, d)

The quinticInOut function combines the motion of the quinticIn() and quinticOut() methods to start the motion from a zero velocity, accelerate motion, then decelerate to a zero velocity. A quintic easing continues the upward trend, raises time to the fifth power : p(t) = t * t * t * t * t

Parameters:

Name	Type	Description
`t`	number	Specifies the current time, between 0 and duration inclusive.
`b`	number	Specifies the initial value of the animation property.
`c`	number	Specifies the total change in the animation property.
`d`	number	Specifies the duration of the motion.

Returns:

The value of the interpolated property at the specified time.

quinticOut(t, b, c, d)

The quinticOut function starts motion fast and then decelerates motion to a zero velocity as it executes. A quintic easing continues the upward trend, raises time to the fifth power : p(t) = t * t * t * t * t

Parameters:

Name	Type	Description
`t`	number	Specifies the current time, between 0 and duration inclusive.
`b`	number	Specifies the initial value of the animation property.
`c`	number	Specifies the total change in the animation property.
`d`	number	Specifies the duration of the motion.

Returns:

The value of the interpolated property at the specified time.

regularIn(t, b, c, d)

The regularIn function starts motion from zero velocity and then accelerates motion as it executes.

Parameters:

Name	Type	Description
`t`	number	Specifies the current time, between 0 and duration inclusive.
`b`	number	Specifies the initial value of the animation property.
`c`	number	Specifies the total change in the animation property.
`d`	number	Specifies the duration of the motion.

Returns:

The value of the interpolated property at the specified time.

regularInOut(t, b, c, d)

The regularInOut function combines the motion of the regularIn() and regularOut() methods to start the motion from a zero velocity, accelerate motion, then decelerate to a zero velocity.

Parameters:

Name	Type	Description
`t`	number	Specifies the current time, between 0 and duration inclusive.
`b`	number	Specifies the initial value of the animation property.
`c`	number	Specifies the total change in the animation property.
`d`	number	Specifies the duration of the motion.

Returns:

The value of the interpolated property at the specified time.

regularOut(t, b, c, d)

The regularOut function starts motion fast and then decelerates motion to a zero velocity as it executes.

Parameters:

Name	Type	Description
`t`	number	Specifies the current time, between 0 and duration inclusive.
`b`	number	Specifies the initial value of the animation property.
`c`	number	Specifies the total change in the animation property.
`d`	number	Specifies the duration of the motion.

Returns:

The value of the interpolated property at the specified time.

sineIn(t, b, c, d)

The sineIn function starts motion from zero velocity and then accelerates motion as it executes.

A sinusoidal equation is based on a sine or cosine function. Either one produces a sine wave—a periodic oscillation of a specific shape.

This is the equation on which I based the easing curve : p(t) = sin( t * Math.PI / 2 )

Parameters:

Name	Type	Description
`t`	number	Specifies the current time, between 0 and duration inclusive.
`b`	number	Specifies the initial value of the animation property.
`c`	number	Specifies the total change in the animation property.
`d`	number	Specifies the duration of the motion.

Returns:

The value of the interpolated property at the specified time.

sineInOut(t, b, c, d)

The sineInOut function combines the motion of the sineIn() and sineOut() methods to start the motion from a zero velocity, accelerate motion, then decelerate to a zero velocity.

A sinusoidal equation is based on a sine or cosine function. Either one produces a sine wave—a periodic oscillation of a specific shape.

This is the equation on which I based the easing curve : p(t) = sin( t * Math.PI / 2 )

Parameters:

Name	Type	Description
`t`	number	Specifies the current time, between 0 and duration inclusive.
`b`	number	Specifies the initial value of the animation property.
`c`	number	Specifies the total change in the animation property.
`d`	number	Specifies the duration of the motion.

Returns:

The value of the interpolated property at the specified time.

sineOut(t, b, c, d)

The sineOut function starts motion fast and then decelerates motion to a zero velocity as it executes.

A sinusoidal equation is based on a sine or cosine function. Either one produces a sine wave—a periodic oscillation of a specific shape.

This is the equation on which I based the easing curve : p(t) = sin( t * Math.PI / 2 )

Parameters:

Name	Type	Description
`t`	number	Specifies the current time, between 0 and duration inclusive.
`b`	number	Specifies the initial value of the animation property.
`c`	number	Specifies the total change in the animation property.
`d`	number	Specifies the duration of the motion.

Returns:

The value of the interpolated property at the specified time.