Example 2: The Colorful Mouseover

Move your mouse over the box below and watch it change colors from red, to blue, then back again.

Mouse over me to change color
<div id="colormouse"
  style="width:200;height:50;background-color:#ff0000;color:#000000;font-size:12pt">
  Mouse over me to change color
</div>

<smil:par begin="colormouse.onmouseover" >
 <smil:animateColor targetElement="colormouse" attributeName="background-color"
  values="#ff0000;#0000ff" begin="0s" dur="1s" autoreverse="true" />
</smil:par>