Introduction to HTML+TIME: Specifying the Beginning and Ending Times | WebReference

Introduction to HTML+TIME: Specifying the Beginning and Ending Times


Introduction to HTML+TIME

Specifying the Beginning and Ending Times

You must specify when the HTML element should appear and for how long. You accomplish it by the BEGIN and END element attributes. You can specify the duration of the element with respect to its beginning time, instead of the ending time. You accomplish it by the DUR attribute. BEGIN, END, and DUR have intuitive defaults. If you don't set the BEGIN attribute, an element will begin displaying when the page loads. If you don't specify the END or DUR attributes, it will remains displayed indefinitely.

The following example shows a slide presentation in which each slide appears and disappears on a predefined schedule. Try it first. We first specify the time2 default behavior as mytime CLASS:

<STYLE>
  .mytime {behavior: url(#default#time2);}
</STYLE>

The body of the page includes four IMG elements, one for every slide of the presentation. For the first slide, we define only the duration attribute. It will start displaying as soon as the page loads:

<IMG CLASS="mytime" SRC="slide1.gif" DUR="7">

We specify HTML+TIME attributes in seconds. The second slide is designated to begin after 2 seconds, the third slide after 4 seconds, and the fourth slide after 6 seconds. All slides are due to disappear after 7 seconds. Here are the last three slides:

<IMG CLASS="mytime" SRC="slide4.gif" BEGIN="2" DUR="7"><BR>
<IMG CLASS="mytime" SRC="slide5.gif" BEGIN="4" DUR="7">
<IMG CLASS="mytime" SRC="slide6.gif" BEGIN="6" DUR="7">

We use here the time2 behavior. Therefore, you need Internet Explorer 5.5 to display it. It is also the reason why we did not use the "t:" prefix on the HTML+TIME attributes. Had we used the time behavior, we would have had to use t:BEGIN and t:DUR instead of BEGIN and END, respectively. Here is the full listing of this example:

<HTML>
<HEAD>
<TITLE>Simple HTML+TIME Example>/TITLE>
<STYLE>
  .mytime {behavior: url(#default#time2);}
</STYLE>
</HEAD>
<BODY>
<IMG CLASS="mytime" SRC="slide1.gif" DUR="7">
<IMG CLASS="mytime" SRC="slide4.gif" BEGIN="2" DUR="7"><BR>
<IMG CLASS="mytime" SRC="slide5.gif" BEGIN="4" DUR="7">
<IMG CLASS="mytime" SRC="slide6.gif" BEGIN="6" DUR="7">
</BODY>
</HTML>

Next: How to include an action

http://www.internet.com


Produced by Yehuda Shiran and Tomer Shiran
All Rights Reserved. Legal Notices.
Created: August 28, 2000
Revised: August 28, 2000

URL: http://www.webreference.com/js/column67/4.html