November 5, 2000 - Terminating HTML+TIME Elements | WebReference

November 5, 2000 - Terminating HTML+TIME Elements

Yehuda Shiran November 5, 2000
Terminating HTML+TIME Elements
Tips: November 2000

Yehuda Shiran, Ph.D.
Doc JavaScript

The HTML+TIME capability in IE 5.5 and up allows you to terminate the timeline at any point, with the endElementAt() method:

object.endElementAt(time1);

where time1 is measured from the beginning of the timeline. When you try to terminate a timeline at a time spot which has already passed, the object will be terminated immediately. The following example (based on a Microsoft script) demonstrates an HTML+TIME object that runs forever:

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6


And here is a button which calls the endElementAt() function:





Here is the definition of the button:


<FORM>
<INPUT TYPE="button" onclick="parallel.endElementAt(12)" VALUE="Terminate after 12 seconds";>
</FORM>

And here is the definition of the HTML+TIME object above:

<HTML>
<HEAD>
<TITLE>
Style Action</TITLE>
<STYLE>
    .time {behavior:url(#default#time2);}
</STYLE>
<XML:NAMESPACE PREFIX="t"/>
</HEAD>
<BODY>
<t:PAR CLASS="time" REPEATCOUNT="indefinite" ID="parallel">
    <H1 ID="hdg1" CLASS="time" STYLE="color:red;" 
	TIMEACTION="style" BEGIN="0" DUR="3">Heading 1</H1>
    <H2 ID="hdg2" CLASS="time" STYLE="color:red;" 
	TIMEACTION="style" BEGIN="0" DUR="3">Heading 2</H2>
    <H3 ID="hdg3" CLASS="time" STYLE="color:blue;" 
	TIMEACTION="style" BEGIN="3" DUR="3">Heading 3</H3>
    <H4 ID="hdg4" CLASS="time" STYLE="color:blue;" 
	TIMEACTION="style" BEGIN="3" DUR="3">Heading 4</H4>
    <H5 ID="hdg5" CLASS="time" STYLE="color:green;" 
	TIMEACTION="style" BEGIN="6" DUR="3">Heading 5</H5>
    <H6 ID="hdg6" CLASS="time" STYLE="color:green;" 
	TIMEACTION="style" BEGIN="6" DUR="3">Heading 6</H6>
</t:PAR>
</BODY>
</HTML>

Learn more about HTML+TIME in Column 67, Introduction to HTML+TIME.