Example 1: The Shrinking Mouse Click

Click on the box below and watch it get smaller over exactly 3 seconds.

<div id="simplemouse"
 style="width:200;height:50;background-color:#00ff00;font-size:12pt">
 Click me to shrink!
</div>

<smil:par begin="simplemouse.onclick">
 <smil:animate targetElement="simplemouse" attributeName="width"
  from="200" to="0" begin="0s" dur="3s" autoreverse="true" />
</smil:par>