View Full Version : Mouseover code problem


RobynPlusOne
02-12-2003, 03:52 AM
Okay, this is my first attempt at Javascript. Could someone check out my code and tell me what in the world I did to make the image show up twice (and neither of the images changes when you mouseover--at least not on my comp!)??

Thanks! :)

pb&j
02-12-2003, 04:19 AM
which images on which webpage?

RobynPlusOne
02-12-2003, 04:24 AM
*chuckles* I knew I'd forget something! Here you go. http://www.geocities.com/LovinGod4ever/index_02.html
The pics will be at the top of the page (pics of flower petals).

pb&j
02-12-2003, 05:36 AM
1. The image shows up twice because you have it shown twice in your coding.

<basefont face="verdana, arial">

<a href="index.html" onmouseover="over_image('img0');" onmouseout="off_image('img0')"> <img src="VDayGraphic01.jpg" border="0" name="img0"> </a>


<TABLE BGCOLOR="#FFFFFF" ALIGN="CENTER" CELLSPACING="1" CELLPADDING="1" BORDER="0">
<tr>
<td width="25%"><center><font face="comic sans ms, verdana" size="2" color="#cc3300"><b>Best viewed with:</b></font><br><br>
<font face="comic sans ms" size="1" color="#000000">Internet Explorer<br>800 x 600 resolution<br>An open heart and mind</font></center></td>
<td width="50%" valign="center"><center><a href="index2.html"><img src="VDayGraphic01.jpg" border="0" alt="Don't forget to sign the guestbook!" title="Don't forget to sign the guestbook!"></a>

You may want to delete the first instance and add the name="img0" to the second instance. (I am guessing the second image shown is where you really want it displayed).

2. The swap may be having a problem because you have not entered the numbers for the width and height into the javascript area.

img0_on = new Image(410,350);
img0_on.src="VDayGraphic02.jpg";
img0_off = new Image(410,350);
img0_off.src="VDayGraphic01.jpg";

RobynPlusOne
02-12-2003, 03:48 PM
Thanks, pb&j (your name is making me hungry, lol)! I followed the instructions straight from Lissa's javascript page, and--correct me if I read it wrong--it said for me to put both of those codes there. If I delete the first code, then there's no mouseover instructions, and that was the whole point of using the script! I'm going to experiment with what you've suggested, and we'll see what happens. :)

RobynPlusOne
02-12-2003, 04:09 PM
I've got it down to one picture...and I toyed with the code a bit, but I can't get the pic to change at mouseover. I checked to make sure Java is enabled on this computer, and it is. *sigh* I'm going to keep trying! If anyone has anymore suggestions, I'm open! http://www.geocities.com/LovinGod4ever/index_02.html

pb&j
02-12-2003, 06:31 PM
I think you are close now...

Try changing this...
<a href="index2.html" onmouseover="on_image('img0_on');" onmouseout="off_image('img0_off')">

To this...
<a href="index2.html" onmouseover="over_image('img0');" onmouseout="off_image('img0');">

In the onmouseover and onmouseout values, you had the _on _off things. I don't think those are required in this spot, just in the script parts.

I also corrected the on_image to over_image to match the function name call.

RobynPlusOne
02-12-2003, 09:13 PM
I changed the things back that you suggested. I had all of that originally, but it still wasn't working, which is why I started messing with the coding "(on and over and whatnot).

What happens now is that, when the page first loads, I see the VDayGraphic01.jpg (http://www.geocities.com/LovinGod4ever/VDayGraphic01.jpg). Then I mouseover it and nothing happens. But once I move the pointer away, the image disappears, and nothing brings it back.

pb&j
02-12-2003, 11:21 PM
I think you may have fixed you problem now. It seems to be working!

Perhaps view the page and hit ALT-F5 to do a good refresh incase your browser is "seeing" a stored version of the page.

RobynPlusOne
02-13-2003, 01:14 PM
Aha! I figured it out! For some reason, the javascript doesn't work when I preview my site within the html editor. That's what the problem was. Thanks so much for your help! :-)