spacer
Yehuda Shiran October 7, 2000
Sequencing Elements Indefinitely
Tips: October 2000

Yehuda Shiran, Ph.D.
Doc JavaScript

Developer News
News Flash: Adobe Has iPhone Workaround
Adobe's Flash 10.1 Goes Mobile (Minus iPhone)
A Salute to Visionary CEOs

The HTML+TIME capability in IE 5.5 and up is based on the timeline principle. An element can be either active or non-active at a certain time point. The following example (based on a Microsoft script) demonstrates several features of HTML+TIME. Each heading changes its color according to the timing specified by the BEGIN and DUR attributes. The action specified is TIMEACTION="style". All heading are of class time, which is defined in the STYLE element as the time2 behavior. All headings are encapsulated in a parallel element, t:PAR, which is repeated indefinitely (REPEATCOUNT="indefinite"). Here is the demo, followed by the code:

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6
<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">
    <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.


People who read this tip also read these tips:

Look for similar tips by subject:

internet.commediabistro.comJusttechjobs.comGraphics.com

Search:

WebMediaBrands Corporate Info

Legal Notices, Licensing, Reprints, Permissions, Privacy Policy.
Advertise | Newsletters | Shopping | E-mail Offers | Freelance Jobs

webref The latest from WebReference.com Browse >
Building a Banking Application Home Page with OOP · Mixing Scripting Languages · Review: phpFox, a Social Networking CMS with all the Bells and Whistles
Sitemap · Experts · Tools · Services · Email a Colleague · Contact FREE Newsletters 
 The latest from internet.com
Enterprise 2.0: Social Networking in the Cloud · BroadSoft Marketplace Hastens Pace of Telephony Innovation · Review: HTC Hero for Sprint