View Single Post
Old 12-06-2007, 09:31 AM   #1 (permalink)
chubster2003
Inactive
 
Join Date: 12-06-07
Posts: 5
iTrader: 0 / 0%
Latest Blog:
None

chubster2003 is liked by many
Rollover Images in IE and Firefox

ok here's my problem

off my computer here my web page works fine in both IE and Firefox, but when posted to the server, ie works fine, but firefox has a hiccup.

when you put the mouse over the rollover images in firefox it changes the picture before, and..... kinda like the order of the pictures is out of wack..

anyway its getting really frustrating. and i can make it work for firefox (by changing the index numbers of all the rollover images) but then ie goes out of wack by changing the picture ahead.....

here's the code


Code:
<script language="JavaScript" type="text/JavaScript"> if (document.images) { var ImgOver=new Array(); ImgOver[0]=new Image(); ImgOver[1]=new Image(); ImgOver[2]=new Image(); ImgOver[3]=new Image(); ImgOver[4]=new Image(); ImgOver[5]=new Image(); ImgOver[6]=new Image(); ImgOver[7]=new Image(); ImgOver[8]=new Image(); ImgOver[9]=new Image(); ImgOver[2].src="images/btns/home_grn.png"; ImgOver[3].src="images/btns/about_grn.png"; ImgOver[4].src="images/btns/products_grn.png"; ImgOver[5].src="images/btns/technology_grn.png"; ImgOver[6].src="images/btns/service_grn.png"; ImgOver[7].src="images/btns/contact_grn.png"; } if (document.images) { var ImgOut=new Array(); ImgOut[0]=new Image(); ImgOut[1]=new Image(); ImgOut[2]=new Image(); ImgOut[3]=new Image(); ImgOut[4]=new Image(); ImgOut[5]=new Image(); ImgOut[6]=new Image(); ImgOut[7]=new Image(); ImgOut[8]=new Image(); ImgOut[9]=new Image(); ImgOut[2].src="images/btns/home_blue.png"; ImgOut[3].src="images/btns/about_blue.png"; ImgOut[4].src="images/btns/products_blue.png"; ImgOut[5].src="images/btns/technology_blue.png"; ImgOut[6].src="images/btns/service_red.png"; ImgOut[7].src="images/btns/contact_blue.png"; } function RollOver(i) { if (document.images) document.images[i].src=ImgOver[i].src } function RollOut(i) { if (document.images) document.images[i].src=ImgOut[i].src } </script></head> <body> <table align="center" border="0" cellspacing="0" cellpadding="0" width="900px"> <tr> <td class="logo" colspan="3" width="100%" height="175px" background="images/bg/white_marble.gif">&nbsp;<a href="index.html"><img border="0" width="340" height="170" src="images/logo2.gif"></a><img border="0" src="images/precision.gif"> </td> </tr> <tr> <td class="nav" colspan="3" width="100%" height="50px" background="images/bg/white_marble.gif"> <a href="index.html" onMouseOver="RollOver(2)" onMouseOut="RollOut(2)"><img border="0" valign="bottom" src="images/btns/home_blue.png"></a> <a href="about.htm" onMouseOver="RollOver(3)" onMouseOut="RollOut(3)"><img border="0" valign="bottom" src="images/btns/about_blue.png"></a> <a href="products.htm" onMouseOver="RollOver(4)" onMouseOut="RollOut(4)"><img border="0" valign="bottom" src="images/btns/products_blue.png"></a> <a href="technology.htm" onMouseOver="RollOver(5)" onMouseOut="RollOut(5)"><img border="0" valign="bottom" src="images/btns/technology_blue.png"></a> <a href="service.htm" onMouseOver="RollOver(6)" onMouseOut="RollOut(6)"><img border="0" valign="bottom" src="images/btns/service_red.png"></a> <a href="contact.htm" onMouseOver="RollOver(7)" onMouseOut="RollOut(7)"><img border="0" valign="bottom" src="images/btns/contact_blue.png"></a> </td> </tr>
hopefully it almost seems like the firefox reads the page in a different order when posted to the site... but dont know how to fix or change code to work...

to test the site for yourself go to here

thanks for your help in advance!

Clinton
chubster2003 is offline   Reply With Quote
Sponsored Links
SEO Hosting by HostGator  Advertise Here  Buy Blog Links