Was this page helpful?
Your feedback about this content is important. Let us know what you think.
Additional feedback?
1500 characters remaining
MSDN Library

TO Attribute | to Property

Sets or retrieves the ending value of an animation.

Syntax

HTML <ELEMENT TO = vValue... >
Scripting [ vValue = ] object.to [ = val ]

Possible Values

vValue Variant that specifies or receives the ending value of the animation. This value can include any of the following length unit designators: px, in, cm, mm, pt, or pc. For more information about the supported length units, see the CSS Length Units Reference.

The property is read/write. The property has no default value.

Remarks

The by property cannot be used on the same element as the to property. If both properties are specified, the by value is ignored.

When writing script to dynamically change the properties of an active animation, results might be unpredictable or undefined. Rrestart the animation with beginElement after you change the properties. the following example shows how to use beginElement.


<SCRIPT>
object.endElement();
object.to='400';
object.beginElement();
</SCRIPT>

For the animate objec, the animateMotionobject, and the animateColor object, the time2 behavior uses the following model to evaluate which properties to animate.

  • The path property overrides any setting for the values property, the from property, the to property, or the by property.
  • The values property, if specified, overrides any setting for the from property, the to property, or the by property.
  • The from property is used, unless the values property or the path property is specified.
  • The to property, if specified, overrides any setting for the by property.
  • The by property doesn't override any properties.

Tthe following script shows how to change an active animation from a path value to a to value.


<SCRIPT>
object.endElement();
object.path=null;
object.to='400';
object.beginElement();
</SCRIPT>

Example

This example demonstrates how to use the to attribute to set the ending value of an animation.


<HTML XMLNS:t ="urn:schemas-microsoft-com:time">
<HEAD>
<?IMPORT namespace="t" implementation="#default#time2">
<STYLE>
	.time{ behavior: url(#default#time2);}
</STYLE>
</HEAD>

<BODY>
<t:ANIMATE AUTOREVERSE="true" TARGETELEMENT="div1" ATTRIBUTENAME="left" 
FROM="100" DUR="5" TO="300" FILL="hold"/>

<DIV id="div1" class="time" 
style="position:absolute; top:170; background-color:#003399;color:#FFCC00">
Moving DIV</DIV>

</BODY>
</HTML>

This feature requires Microsoft® Internet Explorer 5.5 or later. Click the following icon to install the latest version. Then reload this page to view the sample.

Standards Information

This property is defined in Synchronized Multimedia Integration Language (SMIL) 2.0 World Wide Web link.

Applies To

t:ANIMATE, t:ANIMATECOLOR, t:ANIMATEMOTION, t:SET

See Also

Introduction to HTML+TIME

Community Additions

Show:
© 2015 Microsoft