DreamWeaver超級技巧5

  26. 製作滑鼠移上去後有變化的動態選單

所謂動態選單其實是兩幅圖,一幅是滑鼠不放在上面所顯示的,另一副是滑鼠移上去所顯示的。我們可以利用dreamweaver提供的行為之中的swap image來實現這個效果。首先插入一副圖片,用滑鼠單擊它,在屬性面版的連線欄內輸入要連線的網頁。然後打開行為面板添,點擊“+”號,選擇swap image。接著出現一個視窗,要你選擇滑鼠移上去後所顯示的圖片,在此選擇第二副圖片,點擊“確定”。好了,效果完成了,多簡單。

27. 用dreamweaver製作出一個類似於下拉選單的效果

製作一個類似於下拉選單的效果需要用到層的隱藏和顯示特性。具體的方法是:在頁面中插入一個單行多列的表格,作為你的選單條。表格的列數由選單選項的多少決定。插入一個層,在層中輸入第一個下拉選單的內容,並把這個層移動到表格第一列的下面。同理,對其他選單項也作如上的操作,插入相應的層。把所有層的顯示屬性(vis)改為隱藏(hidden)。

選擇表格的第一個單元,單擊視窗(windows)→行為(behaviors),彈出行為面板。按下“+”添加行為show-hide layers,並將第一個層(layer1)屬性改為顯示(show),其他層的屬性改為隱藏(hide)。接著在行為面板中編輯這個行為,將它的觸發事件(events)改為onmouseover。這樣,當滑鼠移動到第一個表格單元之上時,第一個下拉選單就會顯示出來。接著再添加一個行為show-hide layers,並將所有層的屬性改為隱藏。接著在行為面板中編輯這個行為,將它的觸發事件(events)改為onmouseout。這樣當滑鼠從第一個表格單元之上移開時,第一個下拉選單就會隱藏起來。對其他的選單項重複上述操作。但要注意設定“選單二”時,第二層顯示,其他層隱藏;設定“選單三”時,第三層顯示,其他層隱藏;依此類推下去。好了,做好了,按f12看看吧。

28. 輕鬆製作下載檔案

用dreamweaver其實很簡單,把要讓瀏覽者下載的檔案名稱寫上,然後拖動滑鼠選取這段文字,在文本的屬性面板上“link”的屬性輸入框中寫上檔案名稱就行了。注意:若被下載的檔案與該網頁不在同一目錄下,則檔案名稱必須包含相對路徑,否則在下載時將提示找不到檔案。

29. 利用dreamweaver的書籤製作跳轉連結

利用dreamweaver的書籤我們可以實現這個功能。具體方法是:將游標移到你想跳轉到的地方,選擇選單中的“插入(insert)→書籤(name anchor)”,輸入書籤的名稱。接下來,在你想調用連結的連結目標框中填入“#書籤名稱”,這樣一個頁面內的跳轉連結就做好了。在這裡,如果我們在書籤名稱前填入網頁的名稱,就會跳轉到其他頁面中的書籤處。 比如說我們在link處填入“#top”,當瀏覽者點擊這個連結時就會跳轉到index頁面中的top書籤處。

30. 去掉圖片和表格接觸地方的空隙

要使圖片和表格接觸的地方不留空隙,僅在表格屬性面板上把外框線(border)設為0是不行的,還需要在表格的屬性面板上把單元格的兩個屬性設為0(即cellspacing="0"和cellpadding="0")。