Image Swap on Mouseover

**PatriotsFan89** · 11-25-2012, 03:04 PM

Okay so after a lot of trial and error. I found a code to swap images on mouseover, then back again on mouseout.
I am going to use this for my website menu. The only problem is that the code does not work when I add muliple
images. The original code uses

image01= new Image()
image01.src="test.gif"
image02= new Image()
image02.src="test2.gif"

So I simply added image03 and image04 like this:

image01= new Image()
image01.src="test.gif"
image02= new Image()
image02.src="test2.gif"
image03= new Image()
image03.src="test3.gif"
image04= new Image()
image04.src="test4.gif"

This did not work.

Here is the code I am using in my <body>:

<a href="#" onmouseover="rollover('Home', image02)"
onmouseout="rollover('Home', image01)">
<img src="/images/Home_off.jpg" name="Home" border="0"></a><a href="#" onmouseover="rollover('Aboutus', image04)"
onmouseout="rollover('Aboutus', image03)"></a><img src="/images/aboutus_off.jpg" name="Aboutus" border="0">

This is the code I am using in my <head>:

<script type="text/javascript">

</script>

The link to where I found the code: http://www.javascriptkit.com/javatutors/image4.shtml

My website where I will be using the code for the menu. (Bottom menu): http://www.matthewedward.ca

Any help would be greatly appreciated. Thank you.

**holyhttp** · 11-29-2012, 12:44 AM

It appears you found the solution.

Thread: Image Swap on Mouseover

Thread Tools

Display

Image Swap on Mouseover

Thread Information

Users Browsing this Thread

Bookmarks

Bookmarks

Posting Permissions