<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: Aaron M. Cohen   







File Name: layout-background-color-fit.smil







Media Components: 1 JPG







Expected Behavior: Tests deprecated background-color, values of fit.







Show smile in windows which use (right to left, top to bottom):







fill, hidden, meet, slice







fill: image stretched to fill region, no background color red visible.







hidden: image aligned to upper left, lower right filled with blue.







meet: image scaled to touch sides, top and bottom filled with green.







slice: image scaled top bottom edges touch, sides overflow region.















<t:par>







<t:img style="width:100;height:100" region="r1" src="../images/smile.jpg" />







<t:img style="width:100;height:100" region="r2" src="../images/smile.jpg" />







<t:img style="width:100;height:100" region="r3" src="../images/smile.jpg" />







<t:img style="width:100;height:100" region="r4" src="../images/smile.jpg" />







</t:par>







</pre>







</DIV>















<head>







<layout type="text/smil-basic-layout">







<root-layout width="800" height="800" />







<region id="r1" top="0" left="0" height="400" width="400" backgroundColor="red" fit="fill" />







<region id="r2" top="0" left="50%" height="400" width="400" backgroundColor="blue" fit="hidden" />







<region id="r3" top="50%" left="0" height="400" width="400" backgroundColor="green" fit="meet" />







<region id="r4" top="50%" left="50%" height="400" width="400" backgroundColor="yellow" fit="slice" />







</layout>







</head>







<t:par>







<t:img style="width:100;height:100" region="r1" src="../images/smile.jpg" />







<t:img style="width:100;height:100" region="r2" src="../images/smile.jpg" />







<t:img style="width:100;height:100" region="r3" src="../images/smile.jpg" />







<t:img style="width:100;height:100" region="r4" src="../images/smile.jpg" />







</t:par>







</body>







 















</html>