webdesign

[toonski84]

*sigh* i really have no idea what's going on here with the css, as i've never used to rollover anything but plain text. This is simple, easy code to do an image rollover with javascript.

put this in your header tag:

Code:

<SCRIPT>
    function OnPic (num) {
      eval("document.getElementById(\"m"+num+"\").src=\"n"+num+".gif\";");
      return true;
    }

    function OffPic (num) {
      eval("document.getElementById(\"m"+num+"\").src=\"m"+num+".gif\";");
      return true;
    }
  </SCRIPT>

and use these as your links:

Code:

<a href="index.shtml" onMouseOver="OnPic(1)" onMouseOut="OffPic(1)"><img src="m1.gif" border=0 id="m1"></a>
  <a href="services.shtml" onMouseOver="OnPic(2)" onMouseOut="OffPic(2)"><img src="m2.gif" border=0 id="m2"></a>
  <a href="portfolio.shtml" onMouseOver="OnPic(3)" onMouseOut="OffPic(3)"><img src="m3.gif" border=0 id="m3"></a>
  <a href="contact.shtml" onMouseOver="OnPic(4)" onMouseOut="OffPic(4)"><img src="m4.gif" border=0 id="m4"></a>

I guess I only use the "CSS Revolution" when it's easier, for layers and positioning now and then. But good ol' html, tables, javascript and css where I need it has never failed me.