1 網(wǎng)站建設(shè)用flash8和Dreamweaver制作彈出菜單
步驟1 新建一個名為“菜單1”、類型為“按鈕”的元件。步驟2 繪制一個無邊框、填充色為黃色的矩形。調(diào)整它的寬為80 px,高為18 px。步驟3 創(chuàng)建文字“內(nèi)容一”,調(diào)整文字的大小、字體、顏色,并放在矩形中央。步驟4 用鼠標右鍵單擊時間軸上的over幀插入關(guān)鍵幀,將填充色改為橙色。在down幀插入關(guān)鍵幀,將填充色改為綠色。步驟5 選擇“窗口/庫”命令打開庫面板。在庫中右鍵單擊“菜單1”元件,選擇“重復(fù)”命令復(fù)制新元件,將其改名為“菜單2”。雙擊“菜單2”元件,進入編輯狀態(tài),分別在up、over、down幀中將“內(nèi)容一”改為“內(nèi)容二”。用同樣的方法制作“菜單3”“菜單4”。彈出菜單制作完成。
2 制作鼠標響應(yīng)區(qū)域
步驟1 新建一個名為“鼠標響應(yīng)區(qū)域”、類型為“按鈕”的元件。在hit幀插入關(guān)鍵幀。
步驟2 繪制一個寬400 px,高150 px,填充色為任意色的矩形(因為hit幀中的內(nèi)容不會顯現(xiàn)在發(fā)布后的動畫中[2])。可以將此按鈕拖拽到scene(場景)中,按Ctrl+Enter進行預(yù)覽,雖看不到按鈕,但鼠標移動到此按鈕的區(qū)域內(nèi)時會出現(xiàn)手形。
3 組合主菜單和彈出菜單
步驟1 新建一個名為“按鈕組合”、類型為“影片剪輯”的元件。從library(庫)中將“主菜單”元件拖拽到layer1,調(diào)整它的位置使其最右端與舞臺中心點對齊,中心軸與舞臺中心軸重合。
步驟2 為第2幀插入關(guān)鍵幀,并且在1、2幀上都加上actionscript(動作):“stop(); ”。回到第1幀,在舞臺上單擊“主菜單”元件,在動作面板中輸入:on (rollOver) {gotoAndStop (2);}意為:當鼠標移動到按鈕上時開始播放第2幀。
步驟3 新建layer2,處于layer1之下。從庫中拖拽“菜單1”“菜單2”“菜單3”“菜單4”元件到layer2的第2幀上,并如圖5排列。
步驟4 選中“菜單1”元件,在屬性面板中選擇“跟蹤按鈕”選項。在actions面板中輸入:on (release) {getURL(“ “);}意為:當鼠標按下時,跳轉(zhuǎn)到鏈接網(wǎng)站建設(shè)頁面。
步驟5 用同樣的方法設(shè)置“菜單2”“菜單3”“菜單4”元件以及在動作面板中輸入相應(yīng)的actions。
步驟6 新建layer3,位于layer2之下,在第2幀插入關(guān)鍵幀,從庫中將“鼠標響應(yīng)區(qū)域”元件拖拽到舞臺居中的位置(如圖6)。單擊“鼠標響應(yīng)區(qū)域”元件,在動作面板中輸入:on (rollOver) {gotoAndStop (1);}意為:當鼠標移動到“鼠標響應(yīng)區(qū)域”按鈕上時,跳轉(zhuǎn)并停止在第1幀。
4 測試 在“場景1”中,將庫中“按鈕組合”元件拖拽到圖層1,調(diào)整其位置,并可適當調(diào)整大小。由于Flash采用矢量技術(shù),因此調(diào)整大小不會失真。最終效果是將鼠標移動到“學習內(nèi)容”按鈕上就出現(xiàn)手形,同時出現(xiàn)4個彈出菜單;將鼠標移動到彈出菜單上也會出現(xiàn)相應(yīng)的變化,單擊即跳轉(zhuǎn)到鏈接頁面。
通過上面介紹的2種方法,可以很輕松地制作出網(wǎng)頁菜單中的下拉菜單,簡潔、方便、實用。2種方法對比:Dreamweaver制作下拉菜單的方法更簡單、快捷,但下拉菜單的外觀形式受到限制,不能有更多的變化;Flash制作下拉菜單的方法復(fù)雜一些,但下拉菜單的外觀形式可以有各式各樣的變化。另外還有一點值得注意:在Dreamweaver中應(yīng)用Show Pop-up Menu行為的主菜單必須設(shè)定假鏈接(#);
并不是所有的網(wǎng)頁瀏覽器都支持Flash的swf文件格式,需要有插件才能正常使用。大家可以在網(wǎng)站建設(shè)中各取所需,制作出適合網(wǎng)頁風格的下拉菜單。