Help - Search - Members - Calendar
Full Version: Image rollover problem
OverclockersClub Forums > Operating Systems & Software Support > Programmer's Corner
CompX
Apr 17 2009, 08:02 AM
Hey guys. I'm wondering if anybody out there could help. I have an image rollover code used on every page of a site I'm working on. It's all Javascript of course, and it works perfect on every page except the main page. Here's the URL, http://www.a-i-t.com/test1/index.html.

Like I said, it works fine on every other page, I just can't figure this out. Thanks in advance.
CompX
Apr 17 2009, 08:37 AM
Here is the Javascript up top for the page.

CODE
  <script type="text/javascript">
<!--

function roll1(img_name, img_src)
   {
   document[img_name].src = img_src;
   }
  
   function roll2(img_name, img_src)
   {
   document[img_name].src = img_src;
   }
  
   function roll3(img_name, img_src)
   {
   document[img_name].src = img_src;
   }
   function roll4(img_name, img_src)
   {
   document[img_name].src = img_src;
   }
   function roll5(img_name, img_src)
   {
   document[img_name].src = img_src;
   }
   function roll6(img_name, img_src)
   {
   document[img_name].src = img_src;
   }
   function roll7(img_name, img_src)
   {
   document[img_name].src = img_src;
   }
   function roll8(img_name, img_src)
   {
   document[img_name].src = img_src;
   }






//-->
</script>





And here is the html for the code.

CODE
<div id="topbar"><div align="cener">
            
            <a href="index.html" >
<img id="logo" src="design/AITlogo.jpg" border ="0"/></a>
<div id="home">
<!--[if IE]><a href="mailto:pii@a-i-t.com"><![endif]--><img id="topmid" src="design/AITtitle.jpg" border="0"/></a>
            <a href="index.html"
onmouseover="roll1('sub_but1', 'design/AIT_home.jpg')"
onmouseout="roll1('sub_but1', 'design/AIThome.jpg')">

<img src="design/AIThome.jpg" border="0"
alt="Move your mouse over me" name="sub_but1" />

</a>
</div>

<div id="exotic">

<a href="exotic.html"
onmouseover="roll2('sub_but2', 'design/AIT_exotic.jpg')"
onmouseout="roll2('sub_but2', 'design/AITexotic.jpg')">

<img src="design/AITexotic.jpg"  border="0"
alt="Move your mouse over me" name="sub_but2" />

</a>
</div>
<div id="soldering">

<a href="solder.html"
onmouseover="roll3('sub_but3', 'design/AIT_soldering.jpg')"
onmouseout="roll3('sub_but3', 'design/AITsoldering.jpg')">

<img src="design/AITsoldering.jpg"  border="0"
alt="Move your mouse over me" name="sub_but3" />

</a>
</div>
<div id="welding">

<a href="electrodes.html"
onmouseover="roll4('sub_but4', 'design/AIT_welding.jpg')"
onmouseout="roll4('sub_but4', 'design/AITwelding.jpg')">

<img src="design/AITwelding.jpg" border="0"
alt="Move your mouse over me" name="sub_but4" />

</a>
</div>
<div id="production">
<a href="machining.html"
onmouseover="roll5('sub_but5', 'design/AIT_production.jpg')"
onmouseout="roll5('sub_but5', 'design/AITproduction.jpg')">

<img src="design/AITproduction.jpg"  border="0"
alt="Move your mouse over me" name="sub_but5" />

</a>
</div>
<div id="precision">
<a href="edm.html"
onmouseover="roll6('sub_but6', 'design/AIT_precision.jpg')"
onmouseout="roll6('sub_but6', 'design/AITprecision.jpg')">

<img src="design/AITprecision.jpg"border="0"
alt="Move your mouse over me" name="sub_but6" />

</a>
</div>
<div id="anodizing">
<a href="anodizing.html"
onmouseover="roll7('sub_but7', 'design/AIT_anodizing.jpg')"
onmouseout="roll7('sub_but7', 'design/AITanodizing.jpg')">

<img src="design/AITanodizing.jpg"  border="0"
alt="Move your mouse over me" name="sub_but7" />

</a>
</div>
<div id="resources">
<a href="resources.html"
onmouseover="roll8('sub_but8', 'design/AIT_resources.jpg')"
onmouseout="roll8('sub_but8', 'design/AITresources.jpg')">

<img src="design/AITresources.jpg" border="0"
alt="Move your mouse over me" name="sub_but8" />

</a>
</div>
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.