"Switch pic on mouseover" dont work -...

User 2356679 Photo


Registered User
3 posts

I'm using this function, http://progrower.coffeecup.com/switchpic.html on my VSD website and it works great!

But! When I want to use it more than once on my website, so that picture 1 changes to picture 2, and when you go over picture number 3 it changes to number 4. It stops working.

I tried the following:

In the head,

<script language="Javascript">
image1=new Image
image1.src="images/Image1.jpg"
image2=new Image
image2.src="images/Image2.png"
</script>

<script language="Javascript">
image3=new Image
image3.src="images/Image3.jpg"
image4=new Image
image4.src="images/Image4.png"
</script>

In two different HTML boxes:

<a onMouseOver="document.picture.src=image2.src" onMouseOut="document.picture.src=image1.src" >
<img name="picture" src="images/Image1.jpg" width="215" height="95" alt="Example" />
</a>

<a onMouseOver="document.picture.src=image4.src" onMouseOut="document.picture.src=image3.src" >
<img name="picture" src="images/Image3.jpg" width="215" height="95" alt="Example" />
</a>

Maybe Eric has a solution? :)
User 187934 Photo


Senior Advisor
20,271 posts

I think somebody asked for this before.:)
http://progrower.coffeecup.com/switchpic.html
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 298877 Photo


Ambassador
292 posts

Instead of using your own script, why not use the mouseover tool within VSD. Then you can have as many instances as you need. e.g. pic1 mouseover reveals pic2, pic3 mouseover reveals pic4, pic5 mouseover reveals pic6 etc.
In VSD, place 1st image, then click mouseover and click Create mouseover. Then with radio button set to mouseover object, click add image and add & place 2nd image.
Now, do the same for 3rd/4th image combination and subsequent images and their mouseover partners.
Dave

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.