AUTOREVERSE Attribute | autoReverse Property

Internet Development Index

Sets or retrieves whether the timeline on an element begins playing in reverse immediately after completing in the forward direction.

Syntax

HTML <ELEMENT AUTOREVERSE = bReverse... >
Scripting object.autoReverse [ = bReverse ]

HTML	<ELEMENT AUTOREVERSE = bReverse... >
Scripting	object.autoReverse [ = bReverse ]

Possible Values

bReverse Boolean that specifies or receives one of the following values:
true Timeline plays in the forward direction until it completes, and then immediately plays in the reverse direction.
false Default. Timeline does not play in the reverse direction after it finishes playing in the forward direction.
The property is read/write. The property has a default value of false.

Remarks

On some systems, this attribute is referred to as "Play forward, then backward." The property cannot be modified in script after the onload event fires on the document body.
Setting autoReverse to true on a video file results in the file being frozen at the frame on which the reverse occurred—that is, on the last frame played.
Audio files do not play in reverse if autoReverse is set; they simply end.
If the element has a repeatCount greater than one and autoReverse is set to true, the element is considered to have completed one loop through the timeline when it has played once forward and once backward.

Example

The following example shows the current loop iteration of an animateMotion element with the autoReverse attribute set to true.

<HTML XMLNS:t ="urn:schemas-microsoft-com:time">
<HEAD>
<TITLE>autoReverse Property</TITLE>
<STYLE>
.time   {behavior: url(#default#time2);}
</STYLE>
<?IMPORT namespace="t" implementation="#default#time2">
<SCRIPT LANGUAGE="JScript">
function fnRepeat()
{
oCount.innerText = "Current iteration: " +
(oAnim.currTimeState.repeatCount + 1);
// Add one because repeatCount is zero-based.
}
</SCRIPT>
</HEAD>
<BODY TOPMARGIN=0 LEFTMARGIN=0 BGPROPERTIES="FIXED" BGCOLOR="#FFFFFF"
LINK="#000000" VLINK="#808080" ALINK="#000000">
<DIV ID="oCount">Current iteration: 1</DIV>
<DIV ID="oDiv" CLASS="time"
STYLE="position:absolute;
top:25px; left:50px;
height:100px; width:100px;
background-color:blue;"
</DIV>
<t:ANIMATEMOTION ID="oAnim" targetElement="oDIV"
to="150,0" dur="1" autoReverse="true" repeatCount="5"
onrepeat="fnRepeat()"/>
</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 .

Applies To

t:TRANSITIONFILTER, t:ANIMATE, t:ANIMATECOLOR, t:ANIMATEMOTION, t:ANIMATION, t:AUDIO, t:EXCL, t:IMG, t:MEDIA, t:PAR, t:REF, t:SEQ, t:SET, time2, t:VIDEO

	t:TRANSITIONFILTER, t:ANIMATE, t:ANIMATECOLOR, t:ANIMATEMOTION, t:ANIMATION, t:AUDIO, t:EXCL, t:IMG, t:MEDIA, t:PAR, t:REF, t:SEQ, t:SET, time2, t:VIDEO