追蹤
我的網誌--養草中
關於部落格
環遊世界要幾天--我的夢想是能有一本蓋滿世界各個國家戳記的護照
,不過1年才出國一次
,可能改行當導遊還比較快(~^o^~) ~~
  • 47134

    累積人氣

  • 1

    今日人氣

    0

    追蹤人氣

下拉式選單語法之1 觸碰式下拉選單


我在網路上找教學時,還找到這一篇也是在寫觸碰式的下拉選單

現在我貼上語法

<script language="JavaScript">

 function init() {

      contents.style.visibility = "visible";

 }

 
 function mouseAction(overOrout) {

      myTable = contents.style;

      if (overOrout) {

            actionCheck = 1;

            setTimeout("animationMenu(1);", 1);

      }

      else {

            actionCheck = 0;

            setTimeout("animationMenu(0);", 1);

      }

 }


 function animationMenu(overOrout) {

      if (overOrout && actionCheck) {

            if (myTable.pixelTop < -10) {

                myTable.pixelTop += 10;

                setTimeout("animationMenu(1)",1);

            }

      } 

 
      else {

            if (!actionCheck && myTable.pixelTop >-103) {

                myTable.pixelTop -=10;

                setTimeout("animationMenu(0)",1);

            }    
 
      }

 }

</script>

 

<body onLoad="init();">

<div id="contents"

 onMouseOver = "mouseAction(1);"

 onMouseOut = "mouseAction(0);"

 align="center"

 style="position: absolute; top:-103px; left: 250px; width: 50px; visibility: hidden;">

<table width="200" border="1"  bordercolor="#FFFFFF" cellpadding="0" cellspacing="0" frame="void">

<tr>

<td>

<br>

<a href="連結網址">網頁名稱1</span></a><br>
 
<a href="連結網址">網頁名稱2</span></a><br>
 
<a href="連結網址">網頁名稱3</span></a><br>
 
<a href="連結網址">網頁名稱4</span></a><br>
 
<a href="連結網址">網頁名稱5</span></a>
</td>
 
</tr>
 
<tr>
 
<td height=18 align=center>
 
<span style="color: #ffffff; font-size: 8pt; font-family: arial; letter-spacing: 0.4em">
 
 <b>連結選單名稱</b>
 
</span>
 
</td>
 
</tr>
 
</table>
 
</div>


要注意的是粉紅色的數字要一致…是以連結的多寡來設,如果你的連結有很多的話,數字就大一點,但是是要負的哦!

黃色的left: 250px;是設定選單與左邊界的距離。
(style="position: absolute; top:-103px; left: 250px; width: 50px; visibility: hidden;">    <-----這是設定絕對位置的語法)

綠色的table width="200"是設定選單的寬度,如果選單想要有底色可以在語法中再加上bgcolor="#色碼",bordercolor是框線的顏色。

<span style="color: #ffffff; font-size: 8pt; font-family: arial; letter-spacing: 0.4em">這是"連結選單名稱"的字體相關設定。

 當選單關閉時的圖像這樣→

 當滑鼠移到選單時會打開,像這樣→


相簿設定
標籤設定
相簿狀態