Show:

Q.Animation Class

Defined in: platform/plugins/Q/web/js/Q.js:9481
Module: Q

Q.Animation class can be used to repeatedly call a function in order to animate something

Constructor

Q.Animation

(
  • callback
  • duration
  • ease
  • [until=1]
  • params
)

Defined in platform/plugins/Q/web/js/Q.js:9481

Parameters:

  • callback Function

    The function to call. It is passed the following parameters:

    • x = the position in the animation, between 0 and 1
    • y = the output of the ease function after plugging in x
    • params = the fourth parameter passed to the run function
  • duration Number

    The number of milliseconds the animation should run

  • ease String | Function

    The key of the ease function in Q.Animation.ease object, or another ease function

  • [until=1] Number optional

    Optionally specify the position at which to pause the animation

  • params Object

    Optional parameters to pass to the callback

Item Index

Methods

Properties

Methods

jump

()

Defined in platform/plugins/Q/web/js/Q.js:9544

Jump to a certain position in the animation. When the animation plays, the next render will use this position. Additionally, you might want to follow jump() with calls to render() and/or pause().

nextFrame

(
  • [position]
)

Defined in platform/plugins/Q/web/js/Q.js:9572

Render the next frame of the animation, and potentially continue playing

Parameters:

  • [position] Number optional

    optionally render a specific position in the animation

pause

()

Defined in platform/plugins/Q/web/js/Q.js:9533

Pause the animation

play

(
  • [until=1]
)

Defined in platform/plugins/Q/web/js/Q.js:9618

Play the animation (resume after a pause)

Parameters:

  • [until=1] Number optional

    optionally specify the position at which to pause the animation

play

(
  • callback
  • duration
  • ease
  • [until=1]
  • params
)
static

Defined in platform/plugins/Q/web/js/Q.js:9634

Play the animation

Parameters:

  • callback Function

    The function to call. It is passed the following parameters:

    • x = the position in the animation, between 0 and 1
    • y = the output of the ease function after plugging in x
    • params = the fourth parameter passed to the run function
  • duration Number

    The number of milliseconds the animation should run

  • ease String | Function

    The key of the ease function in Q.Animation.ease object, or another ease function

  • [until=1] Number optional

    Optionally specify the position at which to pause the animation

  • params Object

    Optional parameters to pass to the callback

render

(
  • [position]
)

Defined in platform/plugins/Q/web/js/Q.js:9606

Render a given frame of the animation

Parameters:

  • [position] Number optional

    defaults to current position

rewind

()

Defined in platform/plugins/Q/web/js/Q.js:9561

Rewind the animation by pausing and jumping to position 0

Properties

ease

Object

Defined in platform/plugins/Q/web/js/Q.js:9663

Ease functions for animations Contains "linear", "bounce", "smooth" and "inOutQuintic". Feel free to add more.

fps

Number

Defined in platform/plugins/Q/web/js/Q.js:9657

The frames per second, used if requestAnimationFrame isn't defined