下拉菜單和交互圖片

2024-09-11 13:32:04

字體：大中小

來源：轉(zhuǎn)載

供稿：網(wǎng)友

本文為中國教程網(wǎng)合作伙伴印象特別供稿，轉(zhuǎn)載必須取得授權(quán)

　　用fw做網(wǎng)頁不僅和dw結(jié)合緊密，而且fw的交互功能也是非常強(qiáng)大的，今天來做一下很常見的2個實(shí)例，雖然很平凡
　　但我希望加上大家創(chuàng)意以后會讓你的靈感飛翔起來！

1,新建一個200*200的畫布畫成如圖樣子要注意的是圖上的橙色的條是由4個50象素寬的條組成，然后復(fù)制一幀,如圖。(圖1)

2.選中第2幀，把中間的條改變?nèi)我獾念伾?圖2)

3.將圖片進(jìn)行切割，然后右鍵單擊條聲的切片，選擇圖中選項(xiàng)。(圖3)

4.注意看圖中紅色的筐，用鼠標(biāo)可以直接點(diǎn)上面的熱區(qū)，也知道自己設(shè)定。(圖4)

5.打開“文件”》》“導(dǎo)出”會出現(xiàn)如圖面版。注意html和切片的設(shè)置關(guān)于fw的圖象優(yōu)化我以后會專門寫一篇教程，因?yàn)獒槍eb的圖象輸出是一個大問題。(圖5)

6.現(xiàn)在讓我們來做下拉菜單，同樣的用右鍵點(diǎn)某個切片，選擇下拉菜單會出現(xiàn)如圖畫面，在內(nèi)容中，你先要想好一共有些什么欄目，他們的從屬關(guān)系又是怎么樣的，我建議自己先畫一個這樣的類似站點(diǎn)地圖的圖案，然后開始新建一系列的菜單。按圖中的“+ -”號旁邊的兩個圖標(biāo)可以調(diào)整各欄目的隸屬關(guān)系。在外觀中可以設(shè)定下拉菜單的風(fēng)格，大小，字體等。在高級中有關(guān)于下拉菜單的高度寬度等設(shè)定。(圖6)

7.用鼠標(biāo)可以拖動圖中蘭色熱區(qū)的位置，而熱區(qū)的位置是代表了下拉菜單執(zhí)行的位置。
還有一點(diǎn)值得注意，如果你沒有嚴(yán)格定位，而是隨意的用鼠標(biāo)拖動下拉菜單的位置導(dǎo)出為html后在800*600和1024*768分辨率下下拉菜單的位置會改變。(圖7)