Example 5: Happy Hour at the Black & Blue Bar



 S M I L e ! 
<span id="cc1"
	class="x">&nbsp;S</span><span id="cc2"
	class="x">&nbsp;M</span><span id="cc3"
	class="x">&nbsp;I</span><span id="cc4"
	class="x">&nbsp;L</span><span id="cc5"
	class="x">&nbsp;e</span><span id="cc6"
	class="x">&nbsp;!</span>

<smil:par repeatCount="indefinite"
	begin="startflashiness.click" end="stopflashiness.click">
	<smil:animateColor targetElement="cc1" attributeName="background-color"
		values="#0000ff;#000000" dur=".5s" begin="0s" autoreverse="true"/>
	<smil:animateColor targetElement="cc2" attributeName="background-color"
		values="#0000ff;#000000" dur=".5s" begin="0.1s" autoreverse="true"/>
	<smil:animateColor targetElement="cc3" attributeName="background-color"
		values="#0000ff;#000000" dur=".5s" begin="0.2s" autoreverse="true"/>
	<smil:animateColor targetElement="cc4" attributeName="background-color"
		values="#0000ff;#000000" dur=".5s" begin="0.3s" autoreverse="true"/>
	<smil:animateColor targetElement="cc5" attributeName="background-color"
		values="#0000ff;#000000" dur=".5s" begin="0.4s" autoreverse="true"/>
	<smil:animateColor targetElement="cc6" attributeName="background-color"
		values="#0000ff;#000000" dur=".5s" begin="0.5s" autoreverse="true"/>
</smil:par>
<input id="stopflashiness" type="button" value="Stop animation" />