TIMER:
Timer: 0
EXPECTED BEHAVIOR:
Testing: 2 keySplines values.
The inner box animation color is represented by the blue line on the graphs. The outer box is animating linearly.
At 0 seconds, the inner and outer boxes will be green.
At 2 seconds, the first keytime starts and the inner and outer boxes will animate from green to yellow. The first graph illustrates the keySpline of the inner box during the first keytime.
At 2-6.7 seconds, the inner box will start animating faster than the outside box, causing the inner box to look a brighter yellow.
At 6.8 seconds, the inner and outer boxes should be the same color yellow.
At 6.9 seconds, the second keytime starts and the inner and outer boxes will animate from yellow to cyan. The second graph illustrates the keySpline of the inner box during the second keytime.
At 6.9-8 seconds, the inner box will animate slower than the outside box, causing the inner box to apear more yellow than the outside box.
At 8 seconds, the inner and outer boxes quit animating and freeze on cyan.
SAMPLE CODE:
<t:animateColor begin="2s" dur="6s" calcMode="spline" keySplines="0 .75 .25 1;1 0 .25 .25" keyTimes="0;.8; 1" targetElement="T1" values="black;red;blue" additive="sum" attributeName="style.backgroundcolor" fill="hold"/>
<t:animateColor begin="2s" dur="6s" CalcMode=linear keyTimes="0;.8; 1" TargetElement=T2 values="black;red;blue" additive="sum" attributeName="style.backgroundcolor" fill="hold"/>
INFORMATION:
Copyright: Copyright 1998-2001 W3C (MIT, INRIA, Keio), All Rights Reserved. See http://www.w3.org/Consortium/Legal/. Author: Debbie Newman, Microsoft
Version: 11/02/2000
Module: animateColor
Feature: calcMode="spline" keySplines="0 .75 .25 1;1 0 .25 .25" keyTimes="0;.8; 1"
File Name: animateColor_spline_003.htm
Media Components: images/spline_img03.gif, images/spline_img04.gif