Timed Hyperlink Sample #2

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 you can clearly see the effect because of the styling of the links:

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" ><h3>sun</h3></a>
	<a class="time" dur="2s" href="media/merglobe.gif" ><h3>mercury</h3></a>
	<a class="time" dur="2s" href="media/venglobe.gif" ><h3>venus</h3></a>
	<a class="time" dur="2s" href="media/earglobe.gif" ><h3>earth</h3></a>
	<a class="time" dur="2s" href="media/marglobe.gif" ><h3>mars</h3></a>
	<a class="time" dur="2s" href="media/jupglobe.gif" ><h3>jupiter</h3></a>
	<a class="time" dur="2s" href="media/satglobe.gif" ><h3>saturn</h3></a>
	<a class="time" dur="2s" href="media/uraglobe.gif" ><h3>uranus</h3></a>
	<a class="time" dur="2s" href="media/nepglobe.gif" ><h3>neptune</h3></a>
	<a class="time" dur="2s" href="media/pluglobe.gif" ><h3>pluto</h3></a>
</t:seq>