Sets or retrieves a semicolon-separated list of one or more values specifying the progress of the transition.
Syntax
HTML | <t:TRANSITIONFILTER VALUES
= sValues... >
|
---|
Scripting | t:TRANSITIONFILTER.values(val) [ = sValues ] |
---|
Possible Values
sValues |
Variant that specifies or receives a list of semicolon-separated values. The values are applied over the course of the transition in the order they appear. Legal values are real numbers in the range 0.0-1.0. |
The property is read/write.
The property has no default value.
Remarks
This attribute can provide more precise control over the progress than a combination of the from, to, and by attributes and overrides those attributes if they are specified.
When writing script to dynamically change the properties of an active animation, developers should consider a couple of issues. Because results might be unpredictable or undefined when you change the properties of an active animation, restart the animation with beginElement after you have made the change. For example:
<SCRIPT>
object.endElement();
object.values='.1;.17;.27;.37;.47;.56;.65;.71;.82;.92;1.0';
object.beginElement();
</SCRIPT>
For the animate, animateMotion, and animateColor objects, the time2 behavior uses the following model to evaluate which properties to animate.
- The values property, if specified, overrides any setting for the from, to, or by properties.
- The from property is used unless the values or path properties are specified.
- The to property, if specified, overrides any setting for the by property.
- The by property doesn't override any properties.
Example
This example shows how the values property effects the progress of the transition. The calcMode property determines how the values attribute is interpreted.
<HTML XMLNS:t = "urn:schemas-microsoft-com:time">
<HEAD>
<STYLE>
.time {behavior: url(#default#time2);}
</STYLE>
<?import namespace = t urn = "urn:schemas-microsoft-com:time"
implementation = "#default#time2" />
</HEAD>
<BODY>
<t:TRANSITIONFILTER BEGIN="oDiv1.begin" TYPE="barWipe" DUR="5"
TARGETELEMENT="oDiv1" VALUES=".1;.17;.27;.37;.47;.56;.65;.71;.82;.92;1.0"
CALCMODE="discrete"/>
<t:TRANSITIONFILTER BEGIN="oDiv1.begin" TYPE="barWipe" DUR="5"
TARGETELEMENT="oDiv2" VALUES=".1;.17;.27;.37;.47;.56;.65;.71;.82;.92;1.0"
CALCMODE="linear"/>
<INPUT TYPE="button" ID="oStartButton" VALUE="Start Transition">
<P>
<DIV CLASS="time" begin="oStartButton.click" ID="oDiv1" DUR="indefinite"
STYLE="position:relative; left:20px; width:420px; height:100px;
background-image:url(ART_time_progress.gif); background-repeat: no-repeat;">
</DIV>
<DIV CLASS="time" begin="oStartButton.click" ID="oDiv2" DUR="indefinite"
STYLE="position:relative; left:20px; width:420px; height:100px;
background-image:url(ART_time_progress.gif); background-repeat: no-repeat;">
</DIV>
</BODY>
</HTML>
This feature requires Microsoft?Internet Explorer 6 or later. Click the following icon to install the latest version. Then reload this page to view the sample.

Applies To
See Also
Introduction to HTML+TIME, Using HTML+TIME Transitions