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 ]
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>
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
See Also
Introduction to HTML+TIME, time2