onmouseover slideshow script question

at this address: http://www.castlekzar.com

My question is this: what code in the tags will change the image back to the default on mouse out?
here is one of my tags:

<a href="/store" onMouseover="changeimage(myimages[0],this.href)"><img border="0" src="images/jpg/catbutton.jpg" width="112" height="102"></a>


I would really appreciate any help.

I'm using this script:


<script>
function changeimage(towhat,url){
if (document.images){
document.images.targetimage.src=towhat.src
gotolink=url
}
}
function warp(){
window.location=gotolink
}

</script>
<script language="JavaScript1.1">
var myimages=new Array()
var gotolink="#"

function preloadimages(){
for (i=0;i<preloadimages.arguments.length;i++){
myimages[i]=new Image()
myimages[i].src=preloadimages.arguments[i]
}
}


preloadimages("images/banners/altbannercat.jpg","images/banners/altbannerphoto.jpg","images/banners/altbannergb.jpg","images/banners/altbannercontact.jpg","images/banners/altbannermeet.jpg", "images/banners/altbannerlink.jpg")
</script>


Thank you in advance!

Try this link: JS info on this
http://www.hesido.com/web.php?page=imageswapping

A JS program link with easy html, accessing the JS
http://www.dynamicdrive.com/dynamicindex15/domroll2_dev.htm

CSS example of mouse rollover:

//css
a.nav{
background:url(src.gif);
}
a.nav:hover{
background:url(over.gif);
}
//mark up

Hope this helps! I couldn't find the html simpler way to do this.

I appreciate it, but I'm not sure how this helps me... May just be over my head.

The image with the mouseoever code is not the one being changed - it's the one in the middle of the six buttons - each button swaps the center image for a different jpg. I'm trying to figure out how to make the center image snap back to the original image if they move their mouse off the button without clicking it.

Thank you for your help! (ummm.... explain things slowly for a non-coder, please?)

the script you have chosen is no best

but to use that script you will need to include the mouseout image in the preload list

then

<a href="/store" onMouseover="changeimage(myimages[0],this.href)" onMouseout="changeimage(myimages[10],this.href);" ><img border="0" src="images/jpg/catbutton.jpg" width="112" height="102"></a>

if 10 was the mouse out image number

There are many image swap scrips that are easier to understand if you do not wish to use the css solution

You rock! Thank you very very much.