Introduction to HTML+TIME

Authoring HTML+TIME

HTML+TIME (Timed Interactive Multimedia Extensions) was first released with Internet Explorer 5. HTML+TIME 2.0 was first released with Internet Explorer 5.5. HTML+TIME is implemented as a DHTML default behavior. You can brush up on DHTML behaviors in our previous columns: Column 22, Internet Explorer 5.0 Review, Part I, Column 23, Internet Explorer 5.0 Review, Part II, and Column 64, HTML Components. HTML+TIME 1.0 is implemented as the time default behavior. HTML+TIME 2.0 is implemented as the time2 default behavior. The time2 default behavior is supposed to supercede the time default behavior. Our experience does not support it 100%. We found cases where time and time2 provide different results. Therefore, we suggest you check both time and time2 when you program HTML+TIME elements. Programming-wise, the difference between using time and time2 is that with time, you need to add the "t:" prefix to all HTML+TIME attributes. With time2 (supported by Internet Explorer 5.5 and above), the "t:" namespace is no longer necessary for HTML+TIME attributes.

HTML+TIME unifies two timing models: the rigid timeline and the event-based relationships. Using a rigid timeline, it is easy to generate timeline behaviors, such as sequences and precise synchronization of media elements. A traditional animation is a perfect application for a rigid timeline. The animation's pictures are played according to a pre-defined and rigid sequence. The disadvantage of a rigid timeline is that it is difficult to generate interaction with it. You can overcome the rigidity of a timeline by jumping between timelines. The event-based timing lends itself to interactive behaviors. The drawback of event-based timing is that it is difficult to generate sequences and precise synchronization of elements with it.

HTML+TIME takes the best of each timing model, simplifying the process of authoring both timed and interactive content. The HTML+TIME model lets you use timeline attributes to describe static, rigid timeline relationship. This is how you ensure synchronization among media elements. On the other hand, you can associate timelines with events, such as clicking a button or mousing over a text. This unified model lets you synchronize media elements, as well as add interactive elements. These interactive elements can start when the user does something, and can have a duration and a repeat count, just like other rigidly-timed elements.

As you have already noticed from the frequency we use the word timeline in this column, the concept of a timeline is central to HTML+TIME. HTML+TIME defines a timeline for all affected elements. The document timeline starts as soon as the page loads and continues as long as the browser renders the page. You can specify that an element's timeline will be synchronized to the document's timeline, or to other elements' timelines. You can pause and resume the document timeline using the object model's methods. Media files that are not completely loaded when scheduled to start, will begin playing as soon as they are ready.

HTML+TIME affect two major element types: content and style. Content elements include the traditional container such as P, DIV, and SPAN, as well the media elements introduced by HTML+TIME (ANIMATION, AUDIO, IMG, MEDIA, and VIDEO). HTML+TIME attributes cause these elements to appear and disappear along the document timeline. Style elements, on the other hand, specify the style to be applied to an element. Examples of popular style elements include B, I, and EM. HTML+TIME attributes allow these style elements to be applied to and removed from an element over time.