    <html xmlns:t ="urn:schemas-microsoft-com:time" >
    <head>
    <style>
    	 .time    { behavior: url(#default#time2);}
    </style>
    <?IMPORT namespace="t" implementation="#default#time2">
    <script>
    function startTimer(){ setInterval(doTimer,400);}
    function doTimer(){ document.all.Timer.innerText =parseInt(document.body.currTimeState.activeTime) }
    </script>
    </head>
    <body timecontainer="seq" onbegin="startTimer()" >
    <font style="color:black; font-size:16"><b>
    Timer:
    <span id="Timer" >0</span>
    </b></font>
    <br><br>
    <DIV align="left" style="position:absolute; top:40; left:300;"><pre>Copyright: Copyright 1998-2001 W3C (MIT, INRIA, Keio), All Rights Reserved.
    See http://www.w3.org/Consortium/Legal/.
    Author: Rob Lanphier
    Version: $Id:$
    Module: Media Object
    Feature: Media object elements (ref, animation, audio, img,
    text, textstream, video)
    "All of these media elements are semantically
    identical.  When playing back a media object, the
    player must not derive the exact type of the media
    object from the name of the media object element."
    File Name: mediaelement.smil
    Media Components: 7 JPEGs
    Expected Behavior: 7 images playing to 7 regions for 7 seconds
    <t:par>
    <!-- misnaming of elements is on purpose...this shouldn't make
    a difference -->
    <t:ref src="../images/smile.jpg" dur="7s" region="r1" />
    <t:animation src="../images/smile.jpg" dur="7s" region="r2" />
    <t:audio  src="../images/smile.jpg" dur="7s" region="r3" />
    <t:img style="width:100;height:100" src="../images/smile.jpg" dur="7s" region="r4" />
    <text src="../images/smile.jpg" dur="7s" region="r5" />
    <textstream src="../images/smile.jpg" dur="7s" region="r6" />
    <t:video style="width:100;height:100" src="../images/smile.jpg" dur="7s" region="r7" />
    </t:par>
    </pre>
    </DIV>
    <head>
    <layout type="text/smil-basic-layout">
    <region id="r1" top="0px" left="0px" height="50px" width="50px" />
    <region id="r2" top="0px" left="50px" height="50px" width="50px" />
    <region id="r3" top="0px" left="100px" height="50px" width="50px" />
    <region id="r4" top="0px" left="150px" height="50px" width="50px" />
    <region id="r5" top="50px" left="0px" height="50px" width="50px" />
    <region id="r6" top="50px" left="50px" height="50px" width="50px" />
    <region id="r7" top="50px" left="100px" height="50px" width="50px" />
    </layout>
    </head>
    <t:par>
    <!-- misnaming of elements is on purpose...this shouldn't make
    a difference -->
    <t:ref src="../images/smile.jpg" dur="7s" region="r1" />
    <t:animation src="../images/smile.jpg" dur="7s" region="r2" />
    <t:audio  src="../images/smile.jpg" dur="7s" region="r3" />
    <t:img style="width:100;height:100" src="../images/smile.jpg" dur="7s" region="r4" />
    <text src="../images/smile.jpg" dur="7s" region="r5" />
    <textstream src="../images/smile.jpg" dur="7s" region="r6" />
    <t:video style="width:100;height:100" src="../images/smile.jpg" dur="7s" region="r7" />
    </t:par>
    </body>
    </html>