CIT041J Index > Lecture Notes - Images > Rollover with Numeric Indexing

Roll over the images below.

Red Yellow Green

The script:

<script type="text/javascript">
//<![CDATA[
function change( whichImage, newSource )
{
    document.images[whichImage].src = newSource;
}
// ]]>
</script>

The HTML:

<p align="center">
<a href="#" onmouseover="change(0, 'rollover/red1.jpg')"
    onmouseout="change(0, 'rollover/red0.jpg')"><img src="rollover/red0.jpg"
    width="100" height="100" alt="Red" /></a>

<a href="#" onmouseover="change(1, 'rollover/yellow1.jpg')"
    onmouseout="change(1, 'rollover/yellow0.jpg')"><img src="rollover/yellow0.jpg"
    width="100" height="100" alt="Yellow" /></a>

<a href="#" onmouseover="change(2, 'rollover/green1.jpg')"
    onmouseout="change(2, 'rollover/green0.jpg')"><img src="rollover/green0.jpg"
    width="100" height="100" alt="Green" /></a>
</p>