2007-07-05 13:45

利用 JavaScript 將表格模擬成按鈕

原始碼
  1. <html> 
  2.  <head> 
  3.    <meta http-equiv="Content-Type" content="text/html; charset=big5"/> 
  4.    <title>利用 JavaScript 將表格模擬成按鈕</title> 
  5.    <script language="JavaScript" type="text/javascript"> 
  6.      <!-- 
  7.      var mouseOverColor = "#CCEEEE"; 
  8.      var mouseOutColor = "#FFFFFF"; 
  9.      var mouseDownColor = "#99CCCC"; 
  10.  
  11.      /* 滑鼠游標重疊時的顏色及滑鼠指標 */ 
  12.      function mOver(Obj){ 
  13.          Obj.style.backgroundColor = mouseOverColor; 
  14.          Obj.style.cursor = "hand"; 
  15.      } 
  16.  
  17.      /* 滑鼠游標離開時的顏色 */ 
  18.      function mOut(Obj){ 
  19.          Obj.style.backgroundColor = mouseOutColor; 
  20.      } 
  21.  
  22.      /* 滑鼠游標按下時的顏色 */ 
  23.      function mDown(Obj){ 
  24.          Obj.style.backgroundColor = mouseDownColor; 
  25.      } 
  26.  
  27.      --> 
  28.    </script> 
  29.  </head> 
  30.  <body> 
  31.    <!-- 利用滑鼠事件去製造相對應的功能 
  32.    onmousedown 當滑鼠按下時的事件 
  33.    onmouseover 當滑鼠指標與物件重疊時的事件 
  34.    onmouseout 當滑鼠指標離開物件時的事件 
  35.    --> 
  36.    <table width="200" border="1"> 
  37.      <tr> 
  38.        <td onmousedown="mDown(this)" 
  39.            onmouseover="mOver(this)" 
  40.            onmouseout="mOut(this)"> 
  41.        </td> 
  42.      </tr> 
  43.    </table> 
  44.  </body> 
  45. </html> 
分類：
相關文章 ：

0 回應:

張貼留言

訂閱： 張貼留言 (Atom)