我們經常在網上遇到這樣一種情況:當鼠標移到一個按鈕上時,按鈕的顏色立即發生變化而且還會發光,或者突然變成了另外一幅圖片,十分有趣,動感非常之強。這個效果就是——懸停按鈕。
要創建“懸停按鈕”可以通過Frontpage 2000來輕松實現。
在沒有任何腳本的情況下利用創建懸停按鈕來添加動畫到您的網頁是一種容易的方式。如同其他的按鈕一樣,懸停按鈕也可以含有指向其他網頁或文件的超鏈接。然而,當站點訪問者單擊或指向懸停按鈕時,該按鈕與普通按鈕的區別便盡顯無遺:它不僅能夠發光,還可顯示自定義圖片甚至播放聲音效果!
下面我們來看看具體怎麼創建懸停按鈕。
首先在網頁視圖模式內,將插入點放置在要創建懸停按鈕的位置。
在“插入”菜單上,指向 “組件” ,然後單擊 [懸停]按鈕,出現“懸停按鈕”屬性對話框(圖1)。
在 “按鈕文本” 框內,鍵入要放在懸停按鈕上的文本標簽。如果您要輸入的標簽比較長,請調整“懸停按鈕”的 “寬度” 到足以容納標簽的長度。
圖1
單擊右邊的“字體”還可以隨意設置文本的字體、字型、大小和顏色。(但您若想使用已包含文本標簽的自定義圖片,就不必輸入任何文本。)
在 “鏈接到” 框中,鍵入在站點訪問者單擊[懸停]按鈕時,就會出現的網頁或文件的 URL。或者單擊 “浏覽” 以查找網頁或文件的位置。
要設置按鈕在網頁上開始顯示的顏色,請在 “按鈕顏色” 框中選擇要使用的顏色。注意,如果您單擊 “自定義” 並且選擇一張要使用在“懸停按鈕”上的圖片,則無法修改按鈕的顏色。
要設置按鈕的背景顏色,請在 “背景顏色” 框中為“懸停按鈕”選擇一種背景顏色。雖然按鈕的背景顏色並不能變成透明的,但您可選擇與網頁背景顏色相配的顏色。
要設置懸停效果的顏色,請在 “效果顏色” 框中為懸停效果選擇顏色。
要設置“懸停按鈕”的大小,請在 “寬度” 和 “高度” 框內,修改設置(以像素為單位)。如果您在懸停按鈕上使用自定義圖片,或者按鈕文本太長,則必須設置按鈕的寬度和高度以匹配圖片或按鈕文本的寬和高。
至於您最感興趣的“效果”設置則有發光、反色發光、微微發光、填充顏色、顏色對比、凹進、凸進等7種之多,您不妨耐心地一個一個去試,找出最炫的一種特效。
實際上更為常用的是,您可以事先准備好兩幅大小相同的圖片,然後選擇對話框左下腳的“自定義”選項,在這裡您可以為“懸停按鈕”設置聲音效果或為“懸停按鈕”設置具有動態顯示效果的圖片。比如在“按鈕” 框內,鍵入要用作“懸停按鈕”背景的圖片的 URL或單擊 “浏覽” 來查找圖片,然後單擊 “確定”;再在“懸停時”框內鍵入要用作“懸停按鈕”變化時的圖片的 URL,選定後單擊 [確定]即可。
在“播放聲音”區域,選擇操作和聲音效果:
為了使站點訪問者在單擊“懸停按鈕”時能夠播放聲音效果,請在“單擊時”框中鍵入聲音效果的 URL或單擊 “浏覽”來查找聲音效果。
為了使站點訪問者在指向“懸停按鈕”時能夠播放聲音效果,請在“懸停時”框中鍵入聲音效果的 URL,或單擊 “浏覽” 來查找聲音效果文件所在位置。
注意,因為“懸停按鈕”實際上是 Java 小程序,所以您可使用的聲音效果文件只能是 .au 格式;而且您不能使用 .midi 或 .wav 格式的聲音文件;此外,.au 文件還必須是 8 位,8000Hz,單聲道,u 法則格式。 全部設置完成後,若要預覽“懸停按鈕”在訪問者利用浏覽器浏覽您的網頁時所呈現的樣子,您可以單擊“預覽”選項卡,或單擊“在浏覽器中預覽”(在 “文件” 菜單上)。
怎麼樣,鼠標所到之處,圖片翻飛音效滾滾,絕對令訪問者折服!