PDA

View Full Version : Simple Navigational Rollover Link (Image Swap) Error- Help


chester p.
09-04-2004, 01:04 AM
Hi...

I created this simple code to display three images/links that when rolled over, swap to an alternate image, giving the illusion of changing colour. Very simple... It seems to work when tested in IExplorer, but other programs find errors in it such as:

(When the image 'Back' is rolled over)
Line 31: 'Images' is undefined
'back_page' is undefined
'next_page' is undefined

(When the image 'Home' is rolled over)
Line 33: 'Assignment' is undefined
'document.home_page' is null or not a homepage

(When the image 'Next' is rolled over)
Line 35: 'Images' is undefined
'Assignment' is undefined
'document.Next_Page' is null or not a homepage

Below is the code.

Any help would be much appreciated... Thankyou.

<HTML>
<HEAD>
<TITLE> Question_2SMP</TITLE>

<SCRIPT Language="JavaScript">

if(document.imagesSMP)

{
buttonBack= new Image
buttonHome= new Image
buttonNext= new Image

buttonBack.src="Back.gif"
buttonHome.src="Home.gif"
buttonNext.src="Next.gif"
buttonBack2.src="Back2.gif"
buttonHome2.src="Home2.gif"
buttoNext2.src="Next2.gif"



}

</SCRIPT>
</HEAD>


<BODY >
<P align="center">
<A href="back_page.htm" onMouseOver="(back_page.htm)"><img src="Images/Back.gif" alt="Back" name="Image1" width="98" height="23" border="0" onMouseOver="Images/Back2.gif" onMouseOut="document.write=next_page.src=buttonNext.src"></img></A>&nbsp;&nbsp;

<A href="home_page.htm" onMouseOver="(Assignment/home_page.htm)"><img src="Images/Home.gif" alt="Home" name="Image2" width="98" height="23" border="0" onMouseOut="document.home_page.src=buttonHome2.src" a.href="Assignment/home_page.htm"></img></a>&nbsp;&nbsp;

<A href="next_page.htm" onMouseOver="(Assignment/next_page.htm)"><img src="Images/Next.gif" alt="Next" name="Image3" width="98" height="23" border="0" onMouseOver="Images/Next2.gif" onMouseOut="document.Next_Page.src=buttonNext2.src"></img></a>

</P>

</BODY>
</HTML>
cr3ative
09-04-2004, 05:38 AM
I'll have a sort through your code when I can, but until then, here's a whole DD section exclusively for onMouseOver events..

clicky here (http://www.dynamicdrive.com/dynamicindex15/index.html)

I'll edit this post later with an answer to your code.
cr3ative

edit: are you sure it works in IExplorer? I'm using IE6 on Service Pack 2, and I get the errors you've described.

Anyway, here's a perfect script for you: clicky here (http://www.dynamicdrive.com/dynamicindex4/image5.htm).

What's wrong with your script is this...

document.write=next_page.src < isn't defined
It's a good attempt at writing a script, but perhaps you might want to refer to the script i've linked above for some inspiration; unfortunately I couldn't repair your code to work when I tried without changing it practically to a DD script.

Hope this helps
cr3ative
chester p.
09-04-2004, 09:54 AM
thanks very much for your reply your reply cr3ative! i'm just a beginner and would prefer to learn myself rather than using scripts, so an answer would be excellent! :)
cr3ative
09-04-2004, 04:50 PM
Hmmm.... I can't really see how any of your script could work, so it'd be hard for me to debug it. Before I went into writing my own scripts, I spent about half a year just looking at other peoples source code, just to see how it worked. It really helps you understand the syntax of different scripts, and so I'd recommend for now just editing a script (links in my post above) to suit your needs.

If you really want me to debug it, fully explain what you want each line to do (i.e "This line calls procedure ChangeImage, and hence swaps the button image").

cr3ative
thevdo
08-14-2006, 10:20 PM
Yo
Just searching the web. This was way back in 2004 where the thought of using CSS only menu's was a dream only realized by the Web Developers elite. There is a good example at http://www.alanwho.com/web-development/css/rollover-css-image-menu which illustrates how to create a CSS only rollover menu that works in most modern browsers including Firefox and the lovely Internet Explorer.