Roll over one of our images. : Button : Form Control JAVASCRIPT DHTML TUTORIALS


JAVASCRIPT DHTML TUTORIALS » Form Control » Button »

 

Roll over one of our images.



<html>
<head>
  <title>JavaScript Unleashed</title>
  <script type="text/javascript" language="JavaScript1.2">
  <!--
    var overImg = new Array();
    overImg[0new Image(24,24);
    overImg[1new Image(24,24);
   
    var defaultImg = new Array();
    defaultImg[0new Image(24,24);
    defaultImg[1new Image(24,24);
   
    overImg[0].src = "http://www.navioo.com/style/logo.png";
    overImg[1].src = "http://www.navioo.com/style/logoRed.png";
   
    defaultImg[0].src = "http://www.navioo.com/style/logo.png";
    defaultImg[1].src = "http://www.navioo.com/style/logoRed.png";
   
    function rollImage(img,type){
      switch(type){
        case "over":
          document.images[img].src = overImg[img].src;
          break;
        case "out":
          document.images[img].src = defaultImg[img].src;
          break;
      }
    }
  //-->
  </script>
</head>
<body>
  <table>
    <tr>
      <td align="center">
        <a href="javascript:void(0)"
             onmouseout="rollImage('0','out')"
             onmouseover="rollImage('0','over')">
          <img border="0" src="back.gif" width="24" height="24" alt="Back">
        </a>      </td>
      <td align="center">
        <a href="javascript:void(0)"
             onmouseout="rollImage('1','out')"
             onmouseover="rollImage('1','over')">
          <img border="0" src="forward.gif" width="24" height="24"
            alt="Forward"></a>
      </td>
    </tr>
  </table>
</body>
</html>

           
       



-

Leave a Comment / Note


 
Verification is used to prevent unwanted posts (spam). .

Follow Navioo On Twitter

JAVASCRIPT DHTML TUTORIALS

 Navioo Form Control
» Button