...

View Full Version : Multiple Onmouseover - Quick Question



Xzan
06-07-2004, 09:46 PM
My Javascript/CSS skills are somewhat limited so il just ask a quick question, iw worked out the code below but for some reason it dosnt work and i need it solved asap, reason im using Javascript for this is simply because i have to show diff technologies on the page.


<A HREF="index.html" onmouseover="document.images[0].src='../Images/hovedside_menu1.jpg'; return true;" onmouseout="document.images.src='../Images/hovedside_menu[0].jpg'; return true;"><IMG SRC="../Images/hovedside_menu.jpg" border="0" width="65"></A>
</p>
<p>
<A HREF="selskapet.html" onmouseover="document.images[1].src='../Images/selskapet_menu1.jpg'; return true;" onmouseout="document.images[1].src='../Images/selskapet_menu.jpg'; return true;"><IMG SRC="../Images/selskapet_menu.jpg" border="0" width="65"></A>
</p>
<p>
<A HREF="tjenester.html" onmouseover="document.images[2].src='../Images/tjenester_menu1.jpg'; return true;" onmouseout="document.images[2].src='../Images/tjenester_menu.jpg'; return true;"><IMG SRC="../Images/tjenester_menu.jpg" border="0" width="65"></A>
</p><p>
<A HREF="produkter.html" onmouseover="document.images[3].src='../Images/Produkter_menu1.jpg'; return true;" onmouseout="document.images[3].src='../Images/Produkter_menu.jpg'; return true;"><IMG SRC="../Images/Produkter_menu.jpg" border="0" width="65"></A>
</p><p>
<A HREF="kontakt.html" onmouseover="document.images[4].src='../Images/kontakt_menu1.jpg'; return true;" onmouseout="document.images[4].src='../Images/kontakt_menu.jpg'; return true;"><IMG SRC="../Images/kontakt_menu.jpg" border="0" width="65"></A>
</p>


Sorry about the messy code, hope anyone have a solution or a "quick fix" I think it has something to do with the ["number"] bracets but im not sure how to fix this
Thanks.

glenngv
06-08-2004, 04:02 AM
The first link should be:


<A HREF="index.html" onmouseover="document.images[0].src='../Images/hovedside_menu1.jpg'; return true;" onmouseout="document.images[0].src='../Images/hovedside_menu.jpg'; return true;"><IMG SRC="../Images/hovedside_menu.jpg" border="0" width="65"></A>

But your implementation could be made more efficient by not relying on the index position of the image collection. The current solution will fail if you insert an image before the links. But this will not:

<p>
<A HREF="index.html" onmouseover="this.firstChild.src='../Images/hovedside_menu1.jpg'; return true;" onmouseout="this.firstChild.src='../Images/hovedside_menu.jpg'; return true;"><IMG SRC="../Images/hovedside_menu.jpg" border="0" width="65"></A>
</p>
<p>
<A HREF="selskapet.html" onmouseover="this.firstChild.src='../Images/selskapet_menu1.jpg'; return true;" onmouseout="this.firstChild.src='../Images/selskapet_menu.jpg'; return true;"><IMG SRC="../Images/selskapet_menu.jpg" border="0" width="65"></A>
</p>
...



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum