1 <!DOCTYPE HTML PUBLIC
"-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
4 <title>API: animation YAHOO.util.ColorAnim (YUI Library)
</title>
5 <link rel=
"stylesheet" type=
"text/css" href=
"assets/api.css">
9 <div id=
"doc3" class=
"yui-t2">
12 <h1>Yahoo! UI Library
</h1>
13 <h3>animation
<span class=
"subtitle">2.2.0</span></h3>
15 <a href=
"./index.html">Yahoo! UI Library
</a>
16 > <a href=
"./module_animation.html">animation
</a>
17 > YAHOO.util.ColorAnim
32 Class
<b>YAHOO.util.ColorAnim
</b>
33 <span class=
"extends">
34 - extends
<a href=
"YAHOO.util.Anim.html">YAHOO.util.Anim
</a>
37 <span class=
"extends">
42 <!-- class tree goes here -->
47 <div class=
"summary description">
48 Anim subclass for color transitions.
49 <p>Usage:
<code>var myAnim = new Y.ColorAnim(el, { backgroundColor: { from: '#FF0000', to: '#FFFFFF' } },
1, Y.Easing.easeOut);
</code> Color values can be specified with either
112233, #
112233,
50 [
255,
255,
255], or rgb(
255,
255,
255)
</p>
53 <div class=
"section constructor details">
54 <h3><a name=
"constructor_detail">Constructor
</a></h3>
57 <strong>YAHOO.util.ColorAnim
</strong>
75 <div class=
"description">
80 <HTMLElement | String
>
82 Reference to the element that will be animated
88 The attribute(s) to be animated.
89 Each attribute is an object with at minimum a
"to" or
"by" member defined.
90 Additional optional members are
"from" (defaults to current value),
"units" (defaults to
"px").
91 All attribute names use camelCase.
97 (optional, defaults to
1 second) Length of animation (frames or seconds), defaults to time-based
103 (optional, defaults to YAHOO.util.Easing.easeNone) Computes the values that are applied to the attributes per frame (generally a YAHOO.util.Easing method)
114 <div class=
"section field inheritance">
115 <h4>Properties inherited from
<a href=
"YAHOO.util.Anim.html">YAHOO.util.Anim
</a>:
</h4>
116 <div class=
"content">
119 <a href=
"YAHOO.util.Anim.html#_onComplete">_onComplete
</a>,
120 <a href=
"YAHOO.util.Anim.html#_onStart">_onStart
</a>,
121 <a href=
"YAHOO.util.Anim.html#_onTween">_onTween
</a>,
122 <a href=
"YAHOO.util.Anim.html#actualFrames">actualFrames
</a>,
123 <a href=
"YAHOO.util.Anim.html#attributes">attributes
</a>,
124 <a href=
"YAHOO.util.Anim.html#currentFrame">currentFrame
</a>,
125 <a href=
"YAHOO.util.Anim.html#duration">duration
</a>,
126 <a href=
"YAHOO.util.Anim.html#el">el
</a>,
127 <a href=
"YAHOO.util.Anim.html#isAnimated">isAnimated
</a>,
128 <a href=
"YAHOO.util.Anim.html#method">method
</a>,
129 <a href=
"YAHOO.util.Anim.html#startTime">startTime
</a>,
130 <a href=
"YAHOO.util.Anim.html#totalFrames">totalFrames
</a>,
131 <a href=
"YAHOO.util.Anim.html#useSeconds">useSeconds
</a>
136 <div class=
"section method details">
137 <h3><a name=
"methodDetails">Methods
</a></h3>
138 <div class=
"content">
140 <a name=
"parseColor">parseColor
</a></h4>
147 <strong>parseColor
</strong>
157 <div class=
"description">
158 Attempts to parse the given string and return a
3-tuple.
161 <div class=
"description">
166 <code>s
<String
></code>
176 <dd>The
3-tuple of rgb values.
</dd>
186 <div class=
"section field inheritance">
187 <h4>Methods inherited from
<a href=
"YAHOO.util.Anim.html">YAHOO.util.Anim
</a>:
</h4>
188 <div class=
"content">
191 <a href=
"YAHOO.util.Anim.html#animate">animate
</a>,
192 <a href=
"YAHOO.util.Anim.html#doMethod">doMethod
</a>,
193 <a href=
"YAHOO.util.Anim.html#getAttribute">getAttribute
</a>,
194 <a href=
"YAHOO.util.Anim.html#getDefaultUnit">getDefaultUnit
</a>,
195 <a href=
"YAHOO.util.Anim.html#getEl">getEl
</a>,
196 <a href=
"YAHOO.util.Anim.html#getStartTime">getStartTime
</a>,
197 <a href=
"YAHOO.util.Anim.html#init">init
</a>,
198 <a href=
"YAHOO.util.Anim.html#isAnimated">isAnimated
</a>,
199 <a href=
"YAHOO.util.Anim.html#onTween">onTween
</a>,
200 <a href=
"YAHOO.util.Anim.html#setAttribute">setAttribute
</a>,
201 <a href=
"YAHOO.util.Anim.html#setRuntimeAttribute">setRuntimeAttribute
</a>,
202 <a href=
"YAHOO.util.Anim.html#stop">stop
</a>,
203 <a href=
"YAHOO.util.Anim.html#toString">toString
</a>
210 <div class=
"section field inheritance">
211 <h4>Events inherited from
<a href=
"YAHOO.util.Anim.html">YAHOO.util.Anim
</a>:
</h4>
212 <div class=
"content">
215 <a href=
"YAHOO.util.Anim.html#onComplete">onComplete
</a>,
216 <a href=
"YAHOO.util.Anim.html#onStart">onStart
</a>,
217 <a href=
"YAHOO.util.Anim.html#onTween">onTween
</a>
233 <li class=
"selected"><a href=
"module_animation.html">animation
</a></li>
235 <li class=
""><a href=
"module_autocomplete.html">autocomplete
</a></li>
237 <li class=
""><a href=
"module_button.html">button
</a></li>
239 <li class=
""><a href=
"module_calendar.html">calendar
</a></li>
241 <li class=
""><a href=
"module_connection.html">connection
</a></li>
243 <li class=
""><a href=
"module_container.html">container
</a></li>
245 <li class=
""><a href=
"module_datasource.html">datasource
</a></li>
247 <li class=
""><a href=
"module_datatable.html">datatable
</a></li>
249 <li class=
""><a href=
"module_dom.html">dom
</a></li>
251 <li class=
""><a href=
"module_dragdrop.html">dragdrop
</a></li>
253 <li class=
""><a href=
"module_element.html">element
</a></li>
255 <li class=
""><a href=
"module_event.html">event
</a></li>
257 <li class=
""><a href=
"module_history.html">history
</a></li>
259 <li class=
""><a href=
"module_logger.html">logger
</a></li>
261 <li class=
""><a href=
"module_menu.html">menu
</a></li>
263 <li class=
""><a href=
"module_slider.html">slider
</a></li>
265 <li class=
""><a href=
"module_tabview.html">tabview
</a></li>
267 <li class=
""><a href=
"module_treeview.html">treeview
</a></li>
269 <li class=
""><a href=
"module_yahoo.html">yahoo
</a></li>
276 <li class=
""><a href=
"YAHOO.util.Anim.html">YAHOO.util.Anim
</a></li>
277 <li class=
""><a href=
"YAHOO.util.AnimMgr.html">YAHOO.util.AnimMgr
</a></li>
278 <li class=
""><a href=
"YAHOO.util.Bezier.html">YAHOO.util.Bezier
</a></li>
279 <li class=
"selected"><a href=
"YAHOO.util.ColorAnim.html">YAHOO.util.ColorAnim
</a></li>
280 <li class=
""><a href=
"YAHOO.util.Easing.html">YAHOO.util.Easing
</a></li>
281 <li class=
""><a href=
"YAHOO.util.Motion.html">YAHOO.util.Motion
</a></li>
282 <li class=
""><a href=
"YAHOO.util.Scroll.html">YAHOO.util.Scroll
</a></li>
289 <li class=
""><a href=
"Anim.js.html">Anim.js
</a></li>
290 <li class=
""><a href=
"AnimMgr.js.html">AnimMgr.js
</a></li>
291 <li class=
""><a href=
"Bezier.js.html">Bezier.js
</a></li>
292 <li class=
""><a href=
"ColorAnim.js.html">ColorAnim.js
</a></li>
293 <li class=
""><a href=
"Easing.js.html">Easing.js
</a></li>
294 <li class=
""><a href=
"Motion.js.html">Motion.js
</a></li>
295 <li class=
""><a href=
"Scroll.js.html">Scroll.js
</a></li>
303 <li><!--<code>Array</code>-->
304 <a href=
"#parseColor">parseColor
</a>
316 Copyright
© 2007 Yahoo! Inc. All rights reserved.