• Animation
  • ParentAnimation
    • ParallelAnimation
    • SequenceAnimation
    • SelectionAnimation
      • ConditionAnimation
      • CaseAnimation
  • FadeAnimation
    • FadeInAnimation
    • FadeOutAnimation
      • PulseAnimation
  • PropertyAnimation
    • DiscreteAnimation
    • InterpolatedAnimation
      • ColorAnimation
      • LengthAnimation
      • MoveAnimation
      • ResizeAnimation
  • ScaleAnimation
  • Action
    • EnableAction
    • HideAction
    • StyleAction
    • OpacityAction
    • ScriptAction

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.