Renegade — Sun, 30 May 2004 03:16:03 +0000

You needed to add an ID="" to your IMG tag - you needed to make your image identifiable.

 function turnOn(imageName) {
   if (document.images) {
     document[imageName].src = eval(imageName + "on.src");
   }
 }

 function turnOff(imageName) {
   if (document.images) {
     document[imageName].src = eval(imageName + "off.src");
   }

That goes in your HEAD tag and then you Identify your image:

<td align="left" valign="top" width="110"><a href="content/csc_about.html" title="About LA Eagle" onMouseOver="turnOn('<em>image1</em>');window.status=' ';return true" onMouseOut="turnOff('<em>image1</em>');window.status='';"><img src="content/img/nav_company_off.gif" <strong>id="image1"</strong> width="110" height="24" /></a></td>

As you can see, the function is trying to find "image1" but couldn't because you haven't identified it. Just add what in bold and you should be fine.

TargetZion — Sat, 29 May 2004 16:40:41 +0000

No thanks necessary... I do what I can... Enjoy!

joec0123 — Sat, 29 May 2004 04:23:53 +0000

thanks, it works, and im going to use it.. but is there any JS experts that can tell me why my previous code wasnt working for educational purposes?

TargetZion — Fri, 28 May 2004 04:26:24 +0000

JAVASCRIPT:

&lt;script type="text/javascript"&gt;
<!--
function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
&lt;/script&gt;

HTML:

  <tr> 
    <td><a href="index.html"></a><a href="index.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('nav1','','home-button01.jpg',1)"><img src="home-button.jpg" name="nav1" width="100" height="34" border="0" alt="" id="nav1" /></a></td>
    <td><img src="div.jpg" alt="" /></td>
    <td><a href="services.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('nav2','','services-button01.jpg',1)"><img src="services-button.jpg" name="nav2" width="100" height="34" border="0" alt="" id="nav2" /></a></td>
    <td><img src="div.jpg" alt="" /></td>
    <td><a href="about.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('nav3','','aboutus-button01.jpg',1)"><img src="aboutus-button.jpg" name="nav3" width="100" height="34" border="0" alt="" id="nav3" /></a></td>
    <td><img src="div.jpg" alt="" /></td>
    <td><a href="portfolio.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('nav4','','portfolio-button01.jpg',1)"><img src="portfolio-button.jpg" name="nav4" width="100" height="34" border="0" alt="" id="nav4" /></a></td>
    <td><img src="div.jpg" alt="" /></td>
    <td><a href="contact.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('nav5','','contactus-button01.jpg',1)"><img src="contactus-button.jpg" name="nav5" width="100" height="34" border="0" alt="" id="nav5" /></a></td>
  </tr>

Just customize the file names and stuff and that's gold... That's actually a snip from my site... So I can vouch for it's functionality...