如何用Dreamweaver輕鬆製作快顯功能表

來源:互聯網
上載者:User

  快顯功能表在網頁製作中是一種非常常用的菜單方式,這種菜單不但製作簡單,而且效果也很好。

  效果說明

  本執行個體所要完成的效果是當滑鼠移動到文字上時,就會彈出一個漂亮的菜單,如圖 17-1 和圖 17-2 所示。

  創作思想

  本執行個體首先在網頁中輸入一行文字,並對文字做一個特殊的超連結,然後利用 Dreamweaver MX 2004 內建的行為製作快顯功能表。

  操作步驟

  ( 1 )輸入文字並設定超連結。在網頁中輸入文字,因為單獨的文本文字是無法添加行為的,按照 Dreamweaver 中的約定,將文字的超連結設定為“ javascript:; ”才能夠添加行為。所以將文字的超連結設為“ javascript:; ”,並執行【顯示彈出式菜單】行為,如圖 17-3 所示。

  ( 2 )設定功能表項目和子功能表項,並為菜單設定超連結,然後安排好各個菜單的次序,如圖 17-4 所示。

  ( 3 )設定頁面元素。將菜單設定為垂直菜單,並分別設定菜單的字型、字型大小、對齊、一般狀態和滑鼠滑過時的狀態,如圖 17-5 所示。

  ( 4 )設定【進階】標籤。在【進階】標籤選項中設定菜單的延遲時間,以及是否顯示菜單邊框。然後設定邊框的寬度、顏色、陰影、高亮,如圖 17-6 所示。

  注意:【菜單延遲】中時間的單位是毫秒( ms ), 1000 毫秒等於 1 秒,在設定時注意換算。

  ( 5 )設定的 x 軸和 y 軸參數。在【位置】標籤選項中設定快顯功能表的 x 軸和 y 軸參數,這兩個參數表示快顯功能表左上方到網頁左上方的距離,如圖 17-7 所示。

  ( 6 )儲存網頁檔案,然後在瀏覽器中開啟該網頁,將滑鼠游標移動到文字上方時即可看到有菜單彈出,本執行個體操作完畢。通過 Dreamweaver ,可以快速製作出以往只能用複雜代碼才能實現的快顯功能表,這樣可以實現複雜菜單的彈出和收縮,方便使用又能讓頁面美觀、整潔。

相關文章

Beyond APAC's No.1 Cloud

19.6% IaaS Market Share in Asia Pacific - Gartner IT Service report, 2018

Learn more >

Apsara Conference 2019

The Rise of Data Intelligence, September 25th - 27th, Hangzhou, China

Learn more >

Alibaba Cloud Free Trial

Learn and experience the power of Alibaba Cloud with a free trial worth $300-1200 USD

Learn more >

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。