A few more things that I have concerns with:
1) Changing color doesn't seem to work very well. The snippet from the wiki,
<h:inputText>
<ace:animation event="change" from="
color: Color value is invalid
" to="
color: Color value is invalid
" />
</h:inputText>
works in a way that I don't understand (in Firefox). Clicking on the text field and typing does nothing, but tabbing away causes the text to flash to black, then slowly animate to red.
2) Event's seem to work with predefined effects, but not with homebrew ones. For example,
This works:
<h:inputText>
<ice:animation event="click" name="highlight"/>
</h:inputText>
This does not:
<h:inputText>
<ice:animation event="click" to="
{ height:100 }
" from="
{ height:20 }
" duration="2000"/>
</h:inputText>
3) When I have a page full of examples like this:
<li> backBoth example
<h:inputTextarea>
<ice:animation event="focus" to="
{ height:100 }
" from="
{ height:20 }
" easeing="backBoth" duration="2000"/>
<ice:animation event="blur" to="
{ height:20 }
" from="
{ height:100 }
" easeing="backBoth" duration="2000"/>
</h:inputTextarea>
</li>
When I first visit the page, the text areas are neither at 100px nor 20px, but somewhere in between like 40px. The animations occur properly to the correct values when triggered, but the default state isn't likely what anyone would expect.
4) While I could get the text areas to change size with home brew animations, I couldn't get either the foreground or background colors to work.
5) None of the The easing parameters appear to make any difference whatsoever, at least with size animations.
I see that the animation calls are deferred to YUI itself, so it's unlikely that these behaviours will change, but I just wanted to note some of the things I've seen:
<h:inputText>
<ice:animation event="change" from="
" to="
" />
<ice:animation event="blur" from="
" to="
" easing="elasticBoth" duration="4000"/>
</h:inputText>
gives the impression that it should change from black to red if the text is changed, and then change back on blur. Except the change isn't fired until blur, so the final state is red, and it never reverts back to black.
<h:inputTextarea>
{ height:100 }<ice:animation event="focus" to="
" from="
{ height:20 }" easeing="backIn" duration="2000"/>
{ height:20 }<ice:animation event="blur" to="
" from="
{ height:100 }" easeing="backIn" duration="2000"/>
</h:inputTextarea>
I think the same situation is present with changing the colors of text. The color change doesn't animate no matter what the duration is, it only changes once.