Roll over the images below.
The script:
<script type="text/javascript">
//<![CDATA[
function change( imageName, newSource )
{
document.images[imageName].src = newSource;
}
// ]]>
</script>
The HTML:
<p align="center">
<a href="#" onmouseover="change('redImg', 'rollover/red1.jpg')"
onmouseout="change('redImg', 'rollover/red0.jpg')"><img src="rollover/red0.jpg"
name='redImg' width="100" height="100" alt="Red" /></a>
<a href="#" onmouseover="change('yellowImg', 'rollover/yellow1.jpg')"
onmouseout="change('yellowImg', 'rollover/yellow0.jpg')"><img src="rollover/yellow0.jpg"
name='yellowImg' width="100" height="100" alt="Yellow" /></a>
<a href="#" onmouseover="change('greenImg', 'rollover/green1.jpg')"
onmouseout="change('greenImg', 'rollover/green0.jpg')"><img src="rollover/green0.jpg"
name='greenImg' width="100" height="100" alt="Green" /></a>
</p>