Timed Hyperlink Sample #3

Copyright © Patrick Schmitz, 2003. You may freely use the associated information and may copy the HTML source, but not the media (which I borrowed from the MSDN samples).

Hyperlink elements can be timed with XHTML+SMIL (a.k.a. HTML+TIME), so that they are only sensitive to activation (usually by clicking on them), when the element is active.

In this example, a sequence of <a> elements is timed, and in addition the timeAction attribute is set to "display", so the links only show up when they are active.

sun

mercury

venus

earth

mars

jupiter

saturn

uranus

neptune

pluto


In the HEAD a style block to bind the time behavior:

<style>
 .time, t\:* { behavior:url(#default#time2); }
</style>
		

The area elements have duration and are wrapped in a repeating sequence:

<t:seq repeatCount="indefinite">
	<a class="time" dur="2s" href="media/sun.gif" timeAction="display" ><h3>sun</h3></a>
	<a class="time" dur="2s" href="media/merglobe.gif" timeAction="display" ><h3>mercury</h3></a>
	<a class="time" dur="2s" href="media/venglobe.gif" timeAction="display" ><h3>venus</h3></a>
	<a class="time" dur="2s" href="media/earglobe.gif" timeAction="display" ><h3>earth</h3></a>
	<a class="time" dur="2s" href="media/marglobe.gif" timeAction="display" ><h3>mars</h3></a>
	<a class="time" dur="2s" href="media/jupglobe.gif" timeAction="display" ><h3>jupiter</h3></a>
	<a class="time" dur="2s" href="media/satglobe.gif" timeAction="display" ><h3>saturn</h3></a>
	<a class="time" dur="2s" href="media/uraglobe.gif" timeAction="display" ><h3>uranus</h3></a>
	<a class="time" dur="2s" href="media/nepglobe.gif" timeAction="display" ><h3>neptune</h3></a>
	<a class="time" dur="2s" href="media/pluglobe.gif" timeAction="display" ><h3>pluto</h3></a>
</t:seq>