snippet library logo
in category
Javascript / OnMouseover / Cross-Browser Rollover
Snippet details
ID: 31
Viewed: 1375
Added: 2001-11-23
Version:
View Demo

User Rated at: 5 Stars
Rate This:
Snippets in this catagory         
Show Printable Version
cross-browser onmouse over links changes color works for IE4+, IE5+, NS4.x, and NS6.x

General Details
Snippet uploaded by: snippet
Email : webmaster@snippetlibrary.com
Snippet By: COBOLdinosaur

<!---Head--->
<HTML> 
<HEAD> 
<TITLE> </TITLE>
<style> 
   .colorA {color:red;}
   .colorB {color:blue; text-decoration:none;}
   .colorC {color:lime;} 
</style>
<SCRIPT>
<!--

   function RollOver (Ltext,lyr,lnk,oldcls,newcls,over)
   {
      var NS=(document.layers) ? true : false;
      var HiLev=(document.getElementById) ? true : false;
      var IE=(document.all) ? true : false;
      var str="<A CLASS='" + newcls + "' HREF='" + lnk + "'";
      if (over)
      {
         str += " onMouseOut="RollOver('"; 
      }
      else
      {
         str+= " onMouseOver="RollOver('";
      }         
      str += Ltext + "', '" + lyr + "','" + lnk + "', '";
      str += newcls + "', '" + oldcls; 
      if (over)
      {
         str += "', false)">" + Ltext + "</A>";
      }
      else
      {
         str += "', true)">" + Ltext + "</A>";
      }
      if (NS)
      {
         with (document.layers[lyr].document)
         {
            open();
            write(str);
            close();
         }
      }
      else
      {
         if (HiLev)
         {
            document.getElementById(lyr).innerHTML=str;
         }
         else
         {
            if (IE)
            {
            document.all[lyr].innerHTML=str;
            }
         }
      }
   }
//--> 
</SCRIPT> 

<!---Body--->


<SPAN ID="div1id" STYLE="position:absolute">
<A CLASS="colorB" HREF="www.blah1.com" onMouseOver="RollOver('go to blah','div1id',this.href,'colorB','colorC',true)">go to blah</A>
</SPAN> 
<BR><BR>
<SPAN ID="div2id" STYLE="position:absolute">
<A CLASS="colorB" HREF="www.blah2.com" onMouseOver="RollOver('go to blahblah','div2id',this.href,'colorB','colorA',true)">go to blahblah</A>
</SPAN> 
<BR><BR>
<SPAN ID="div3id" STYLE="position:absolute">
<A CLASS="colorB" HREF="www.blah1.com" onMouseOver="RollOver('NOT here','div3id',this.href,'colorB','colorA',true)">NOT here</A>
</SPAN> 
<BR><BR>




No Reviews to show


Please completely fill out the form below if you want to review this snippet. All reviews are subject to validation.


Subject:

Reviewed By:

Write a review:





Terms of Conditions
Powered By
Avian Hosting
© 2005 snippetlibrary.com All Rights Reserved.