2007-07-05 13:45

利用 JavaScript 將表格模擬成按鈕

<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=big5"/>
    <title>利用 JavaScript 將表格模擬成按鈕</title>
    <script language="JavaScript" type="text/javascript">
      <!--
      var mouseOverColor = "#CCEEEE";
      var mouseOutColor = "#FFFFFF";
      var mouseDownColor = "#99CCCC";

      /* 滑鼠游標重疊時的顏色及滑鼠指標 */
      function mOver(Obj){
          Obj.style.backgroundColor = mouseOverColor;
          Obj.style.cursor = "hand";
      }

      /* 滑鼠游標離開時的顏色 */
      function mOut(Obj){
          Obj.style.backgroundColor = mouseOutColor;
      }

      /* 滑鼠游標按下時的顏色 */
      function mDown(Obj){
          Obj.style.backgroundColor = mouseDownColor;
      }

      -->
    </script>
  </head>
  <body>
    <!-- 利用滑鼠事件去製造相對應的功能
    onmousedown 當滑鼠按下時的事件
    onmouseover 當滑鼠指標與物件重疊時的事件
    onmouseout 當滑鼠指標離開物件時的事件
    -->
    <table width="200" border="1">
      <tr>
        <td onmousedown="mDown(this)"
            onmouseover="mOver(this)"
            onmouseout="mOut(this)">
        </td>
      </tr>
    </table>
  </body>
</html>

0 回應: