Print Friendly

# Class YAHOO.util.ColorAnim

Package: | YAHOO.util
Class: | ColorAnim
Extends: | Anim
Defined In: | animation.js

Anim subclass for color transitions.

Usage: `var myAnim = new Y.ColorAnim(el, { backgroundColor: { from: '#FF0000', to: '#FFFFFF' } }, 1, Y.Easing.easeOut);` Color values can be specified with either 112233, #112233, [255,255,255], or rgb(255,255,255)

## Public Properties

Property | Defined By
--- | ---
| attributes : Object | Anim
The collection of attributes to be animated. Each attribute must have at least a "to" or "by" defined in order to ani...
| currentFrame : Int | Anim
The location of the current animation on the timeline. In time-based animations, this is used by AnimMgr to ensure th...
| duration : Number | Anim
The length of the animation. Defaults to "1" (second).
| method : Function | Anim
The method that will provide values to the attribute(s) during the animation. Defaults to "YAHOO.util.Easing.easeNone".
| totalFrames : Int | Anim
The total number of frames to be executed. In time-based animations, this is used by AnimMgr to ensure the animation ...
| useSeconds : Boolean | Anim
Whether or not the duration should be treated as seconds. Defaults to true.

## Public Methods

Method | Defined By
--- | ---
| ColorAnim(`HTMLElement/String el`, `Object attributes`, `Number duration`, `Function method`) | ColorAnim
| animate() : void | Anim
Starts the animation by registering it with the animation manager.
| doMethod(`String attr`, `Number start`, `Number end`) : Number | Anim
Returns the value computed by the animation's "method".
| getAttribute(`String attr`) : Number | Anim
Returns current value of the attribute.
| getDefaultUnit(`attr attr`) : String | Anim
Returns the unit to use when none is supplied.
| getEl() : HTMLElement | Anim
Returns a reference to the animated element.
| getStartTime() : Date | Anim
Returns the animation start time.
| init(`String/HTMLElement el`, `Object attributes`, `Number duration`, `Function method`) : void | Anim
Constructor for Anim instance.
| isAnimated() : Boolean | Anim
Checks whether the element is currently animated.
| parseColor(`String s`) : Array | ColorAnim
Attempts to parse the given string and return a 3-tuple.
| setAttribute(`String attr`, `Number val`, `String unit`) : void | Anim
Applies a value to an attribute.
| stop([`Boolean finish`]) : void | Anim
Stops the animation. Normally called by AnimMgr when animation completes.
| toString() : String | Anim
Provides a readable name for the Anim instance.

## Public Events

Event | Defined By
--- | ---
| onComplete : () | Anim
Custom event that fires when animation ends Listen via subscribe method (e.g. myAnim.onComplete.subscribe(someFunction)
| onStart : () | Anim
Custom event that fires when animation begins Listen via subscribe method (e.g. myAnim.onStart.subscribe(someFunction)
| onTween : () | Anim
Custom event that fires between each frame Listen via subscribe method (e.g. myAnim.onTween.subscribe(someFunction)

## Property Details

### attributes

`public Object attributes`
The collection of attributes to be animated. Each attribute must have at least a "to" or "by" defined in order to animate. If "to" is supplied, the animation will end with the attribute at that value. If "by" is supplied, the animation will end at that value plus its starting value. If both are supplied, "to" is used, and "by" is ignored. Optional additional member include "from" (the value the attribute should start animating from, defaults to current value), and "unit" (the units to apply to the values).
This property is defined by Anim.

### currentFrame

`public Int currentFrame`
The location of the current animation on the timeline. In time-based animations, this is used by AnimMgr to ensure the animation finishes on time.
This property is defined by Anim.

### duration

`public Number duration`
The length of the animation. Defaults to "1" (second).
This property is defined by Anim.

### method

`public Function method`
The method that will provide values to the attribute(s) during the animation. Defaults to "YAHOO.util.Easing.easeNone".
This property is defined by Anim.

### totalFrames

`public Int totalFrames`
The total number of frames to be executed. In time-based animations, this is used by AnimMgr to ensure the animation finishes on time.
This property is defined by Anim.

### useSeconds

`public Boolean useSeconds`
Whether or not the duration should be treated as seconds. Defaults to true.
This property is defined by Anim.

## Constructor Details

### ColorAnim

`public function ColorAnim(`HTMLElement/String el`, `Object attributes`, `Number duration`, `Function method`)`
Parameters:

- `el` : HTMLElement/String
  Reference to the element that will be animated
- `attributes` : Object
  The attribute(s) to be animated. Each attribute is an object with at minimum a "to" or "by" member defined. Additional optional members are "from" (defaults to current value), "units" (defaults to "px"). All attribute names use camelCase.
- `duration` : Number
  (optional, defaults to 1 second) Length of animation (frames or seconds), defaults to time-based
- `method` : Function
  (optional, defaults to YAHOO.util.Easing.easeNone) Computes the values that are applied to the attributes per frame (generally a YAHOO.util.Easing method)

## Method Details

### animate

`public function animate()`
Starts the animation by registering it with the animation manager.
Parameters:

- None.

Returns:

- `void`

This method is defined by Anim.

### doMethod

`public function doMethod(`String attr`, `Number start`, `Number end`)`
Returns the value computed by the animation's "method".
Parameters:

- `attr` : String
  The name of the attribute.
- `start` : Number
  The value this attribute should start from for this animation.
- `end` : Number
  The value this attribute should end at for this animation.

Returns:

- `Number`
  The Value to be applied to the attribute.

This method is defined by Anim.

### getAttribute

`public function getAttribute(`String attr`)`
Returns current value of the attribute.
Parameters:

- `attr` : String
  The name of the attribute.

Returns:

- `Number`
  val The current value of the attribute.

This method is defined by Anim.

### getDefaultUnit

`public function getDefaultUnit(`attr attr`)`
Returns the unit to use when none is supplied.
Parameters:

- `attr` : attr
  The name of the attribute.

Returns:

- `String`
  The default unit to be used.

This method is defined by Anim.

### getEl

`public function getEl()`
Returns a reference to the animated element.
Parameters:

- None.

Returns:

- `HTMLElement`

This method is defined by Anim.

### getStartTime

`public function getStartTime()`
Returns the animation start time.
Parameters:

- None.

Returns:

- `Date`
  current value of startTime.

This method is defined by Anim.

### init

`public function init(`String/HTMLElement el`, `Object attributes`, `Number duration`, `Function method`)`
Constructor for Anim instance.
Parameters:

- `el` : String/HTMLElement
  Reference to the element that will be animated
- `attributes` : Object
  The attribute(s) to be animated. Each attribute is an object with at minimum a "to" or "by" member defined. Additional optional members are "from" (defaults to current value), "units" (defaults to "px"). All attribute names use camelCase.
- `duration` : Number
  (optional, defaults to 1 second) Length of animation (frames or seconds), defaults to time-based
- `method` : Function
  (optional, defaults to YAHOO.util.Easing.easeNone) Computes the values that are applied to the attributes per frame (generally a YAHOO.util.Easing method)

Returns:

- `void`

This method is defined by Anim.

### isAnimated

`public function isAnimated()`
Checks whether the element is currently animated.
Parameters:

- None.

Returns:

- `Boolean`
  current value of isAnimated.

This method is defined by Anim.

### parseColor

`public function parseColor(`String s`)`
Attempts to parse the given string and return a 3-tuple.
Parameters:

- `s` : String
  The string to parse.

Returns:

- `Array`
  The 3-tuple of rgb values.

This method is defined by ColorAnim.

### setAttribute

`public function setAttribute(`String attr`, `Number val`, `String unit`)`
Applies a value to an attribute.
Parameters:

- `attr` : String
  The name of the attribute.
- `val` : Number
  The value to be applied to the attribute.
- `unit` : String
  The unit ('px', '%', etc.) of the value.

Returns:

- `void`

This method is defined by Anim.

### stop

`public function stop([`Boolean finish`])`
Stops the animation. Normally called by AnimMgr when animation completes.
Parameters:

- `finish` : Boolean
  (optional) If true, animation will jump to final frame.

Returns:

- `void`

This method is defined by Anim.

### toString

`public function toString()`
Provides a readable name for the Anim instance.
Parameters:

- None.

Returns:

- `String`

This method is defined by Anim.

## Event Details

### onComplete

`public event onComplete`
Custom event that fires when animation ends Listen via subscribe method (e.g. myAnim.onComplete.subscribe(someFunction)
Subscribers will be called with the following parameters:

- None.

This event is defined by Anim.

### onStart

`public event onStart`
Custom event that fires when animation begins Listen via subscribe method (e.g. myAnim.onStart.subscribe(someFunction)
Subscribers will be called with the following parameters:

- None.

This event is defined by Anim.

### onTween

`public event onTween`
Custom event that fires between each frame Listen via subscribe method (e.g. myAnim.onTween.subscribe(someFunction)
Subscribers will be called with the following parameters:

- None.

This event is defined by Anim.

Copyright © 2006 Jack Slocum. All rights reserved.