Skip to content
This repository has been archived by the owner on Oct 14, 2024. It is now read-only.

PropertyAnimation

MikhailTymchukDX edited this page Apr 12, 2017 · 2 revisions

PropertyAnimation (inherits Animation)

The PropertyAnimation is a useful base animation that will assign the value from getAnimatedValue to a specified property. You can provide the name of a property alongside an optional propertyKey (which indicates the value property[propertyKey], like style['backgroundColor']).

Client properties

Name Description
property A string value specifying the name of the target element's property to be set when animation plays.
propertyKey Optional key of the property to be set (which indicates the value property[propertyKey], like style['backgroundColor']). Note that for the style property, the key must be in a JavaScript friendly format (i.e. backgroundColor instead of background-color).

Client methods

Name Description
constructor(target, duration, fps, property, propertyKey)
getValue() Get the property's current value.
onStart() The onStart method is called just before the animation is played each time.
setValue(value) Set the property's value.

Client properties

property

A string value specifying the name of the target element's property to be set when animation plays.

Getter name: get_property()
Setter name: set_property(value)

propertyKey

Optional key of the property to be set (which indicates the value property[propertyKey], like style['backgroundColor']). Note that for the style property, the key must be in a JavaScript friendly format (i.e. backgroundColor instead of background-color).

Getter name: get_propertyKey()
Setter name: set_propertyKey(value)

Client methods

constructor(target, duration, fps, property, propertyKey)

Params:

  • target

    • Type: Object
    • Description: Length of the animation in seconds. The default is 1.
  • duration

    • Type: Number
    • Description: Length of the animation in seconds. The default is 1.
  • fps

    • Type: Number
    • Description: Number of steps per second. The default is 25.
  • property

    • Type: Object
    • Description: Property of the target element to set when animating.
  • propertyKey

    • Type: Object
    • Description: optional key of the property to be set (which indicates the value property[propertyKey], like style['backgroundColor']). Note that for the style property, the key must be in a JavaScript friendly format (i.e. backgroundColor instead of background-color).

getValue()

Get the property's current value.

onStart()

The onStart method is called just before the animation is played each time.

setValue(value)

Set the property's value.

Params:

  • value
    • Type: Object
    • Description: Value to set.
Clone this wiki locally