Rollover to Show & Hide Images

[dst]

I have a simple html list of items and I would like to set it up so that when you rollover an item in the list, an associated image is shown/switched. If anyone can point me in the right direction or show me a site with an expample of this type of scirpt I'd be very gratefull. Thanks

[JHL]

<img src='' id='imgChange' width=75 height=75 style='visibility: hidden'>
<br>
<a href='#' onmouseover="document.getElementById('imgChange').src = 'imageA.gif'; document.getElementById('imgChange').style.visibility = 'visible'" onmouseout="document.getElementById('imgChange').style.visibility = 'hidden'">
<img src='imageA.gif' width=75 height=75 style='border: none'>
</a>
<br>
<a href='#' onmouseover="document.getElementById('imgChange').src = 'imageB.gif'; document.getElementById('imgChange').style.visibility = 'visible'" onmouseout="document.getElementById('imgChange').style.visibility = 'hidden'">
<img src='imageB.gif' width=75 height=75 style='border: none'>
</a>

[dst]

Thanks heaps JHL, that worked great, exactly what I was looking for.