DIV CSS 佈局教程網

如果想要使網頁更“聰明”的話，就要使用行為來感知外界的信息並做出相應的響應。這些外界信息包括鼠標的活動，如頁面的調用與關閉、鼠標移動到頁面元素上點擊元素或移開元素，以及焦點的改變和鍵盤的情況等各種變化，對不同的頁面內容有不同的事件，另外能夠響應的事件也和浏覽器有關，一般說來，3.0的浏覽器能夠響應的事件要少於4.0浏覽器，而IE4能夠響應的事件要多於Netscape4.0浏覽器，我們可以根據不同的浏覽器進行不同的設置。

　　

    圖Ａ三是一個簡單的例子，這個頁面有兩項內容，一部分是上面的文字“Click here for more information"並成為一個超鏈接，下面是一個汽水瓶的圖片。現在想要產生這樣的效果，當浏覽者將鼠標移到超鏈接的文字之上的時候發出一段開啟汽水瓶的聲音，這段聲音是已有的資源。我們可以這樣做。將超鏈接設置成工作的焦點，可以用鼠標在這行文字上點一下。這時調出行為浮動面板（window菜單的behavior命令），

    如圖Ａ四這個浮動面板一共有兩部分組成。左邊是事件，右邊是對事件的響應。我們可以看到浮動面板的事件欄中顯示了 Events ，表明現在是對剛才選中的超鏈接所產生的各種可能的事件。在這一欄中我們可以選擇浏覽器的類型，例子中是選擇IE4作為目標浏覽器，我們點擊加號會彈出一個菜單，菜單中列出各種可能產生的事件。我們選擇事件，當鼠標移動到目標元素上的時候就會產生事件信息，選中以後這一事件被加入事件欄中，一個頁面元素可以激發許多事件。當一個事件有響應的時候這個事件才是有價值的事件，因為即使沒有選事件也是存在的，也是會在適當的時候被激發，只是沒有響應所以對頁面沒有任何影響。用同樣的方法我們點擊行為浮動面板右側的響應欄中的加號按鈕，這裡也列出了所有可能的響應，包括改變屬性、檢查插件、聲音控制、浏覽器狀態條顯示何種信息，跳到指定的地址上，打開新的浏覽器窗口。彈出消息以及層的變化等等。我們選擇聲音控制（control sound ）一項，這時會自動彈出對話框提示我們開始和結束聲音。

    圖Ａ五就是彈出的對話框，選擇合適的聲音文件後（注意，要選擇網頁允許的聲音文件格式）整個有關本例的事件及響應的設置就完成了。我們沒有編寫一句代碼就完成了較為復雜的交互式操作，這足以表明Dreamweaver在編寫高級網頁時的優越性。

　　我們可以用這種方法編寫出十分精彩的網頁，比如：當我們開啟一個網頁的時候先奏一段音樂（這裡用到對onLoad事件的響應），當浏覽者將鼠標移動到網頁的各個項目上時，這一項目閃爍並響起音樂且狀態條顯示項目的說明（這裡用到對onMouseOver事件的響應，響應為圖片來源控制、聲音控制和狀態條信息的設置），當浏覽者隨超鏈接進入新的頁面並點擊頁面的MOV格式的電影時檢查浏覽器是否有quicktime插件，如果有就播放這段電影（對onClick事件響應，響應為檢查插件），我們可以將一幅圖片作為一超鏈接，當浏覽者點擊或按下任意鍵時顯示目標頁（用到對onKeyPress 和onMouseOver事件的響應），如果是商業或教育網頁我們還可以對onHelp 和onError等事件產生響應。我們還可以對整個頁面進行控制（用到對onReadyStateChange事件的響應），如果浏覽者結束浏覽時說一些感謝的話或傳達一些信息或打開相關網頁就要用到對onClose事件的響應等等，還有許多更精彩的事件和不同尋常的響應事件留給廣大讀者去發現吧。