第3版HTML5DreamweaverPhotoshopCSS3AnimateAdobeCC網(wǎng)頁設計與制作應用教程網(wǎng)頁設計與制作第7章行為和模版本章重點應用“行為”面板應用模板應用庫添加內置行為的方法七、行為和模版7.1行為及其使用方法7.3jQuery特效7.2應用內置行為7.4應用模板7.5管理模板

網(wǎng)頁設計通常不僅僅包含靜態(tài)的文本和圖像，還有很多交互式動態(tài)效果，這種效果可以通過Dreamweaver提供的又一強大功能來實現(xiàn)，即行為。模板是一種特殊類型的文檔，它可以將具有相同版面布局的頁面制作成一個模板，而后大量生成基于模板的網(wǎng)頁。7.1行為及其使用方法行為是事件和由該事件觸發(fā)的動作的組合。“事件”是觸發(fā)動態(tài)效果的條件，是瀏覽器生成的消息，指示該頁的訪問者執(zhí)行了某種操作。網(wǎng)頁事件分為不同的種類：有的與鼠標相關，如鼠標放置在圖像上、移出圖像、單擊圖像等。“動作”是由預先編寫的JavaScript代碼組成的，這些代碼最終產生動態(tài)效果。例如打開瀏覽器窗口、顯示或隱藏層、播放聲音等?！皩ο蟆?、“事件”和“動作”三者關系為：對象在發(fā)生設定事件的情況下，產生相應動作。例如，對于交換圖像這一行為，可以用三要素來解釋：圖像（對象）在鼠標放置其上時（事件），更換為另外一幅圖片（動作）,一般的動作是：改變某一個對象（原來的對象或者新對象）的屬性。7.1.1行為概述7.1行為及其使用方法7.1.2“行為”面板行為面板包含以下選項：顯示設置事件：僅顯示附加到當前對象的那些事件。事件被分別劃歸到客戶端或服務器端類別中。顯示所有事件：按字母順序顯示屬于特定類別的所有事件。添加動作(+)：顯示特定菜單，其中包含可以附加到當前選定元素的動作。當從該列表中選擇一個動作時，將出現(xiàn)一個對話框，在此對話框中指定該動作的參數(shù)。刪除(–)：從行為列表中刪除所選的事件和動作。向上箭頭和向下箭頭按鈕：在行為列表中上下移動特定事件的選定動作。對于不能在列表中上下移動的動作，箭頭按鈕將處于禁用狀態(tài)。事件：顯示一個下拉菜單，其中包含可以觸發(fā)該動作的所有事件，此菜單僅在選中某個事件時可見（當單擊所選事件名稱旁邊的箭頭按鈕時顯示此菜單）。根據(jù)所選對象的不同，顯示的事件也有所不同。顯示事件：指定當前行為在哪個瀏覽器中起作用（這是“事件”菜單的子菜單）。在此菜單中進行的選擇將確定“事件”菜單中顯示哪些事件。7.1.3行為的應用方法1.添加行為2.更改行為7.2應用內置行為7.2.1交換圖像7.2.2彈出信息7.2.3調用JavaScript7.2.4顯示-隱藏元素7.2.5改變屬性7.2.6轉到URL7.2.7打開瀏覽器窗口7.2.8設置文本7.3jQuery特效7.3.1概念DreamweaverCC中增加了一系列jQuery特效，使用炫酷的jQuery特效用于創(chuàng)建動畫過渡或者可視方式修改頁面，可以讓頁面元素產生更靈活豐富的動態(tài)效果。Dreamweaver與jQuery相結合，無需編寫任何代碼，即可加特效。在“行為”面板的“效果”子菜單中有一系列命令，如圖7-24所示。特效實現(xiàn)的方法基本一致，可以舉一反三。下面以“Blind”和“Bounce”兩個實例進行介紹。7.4應用模板7.4.1創(chuàng)建模板在DreamweaverCC中，有兩種方法可以創(chuàng)建網(wǎng)頁模板。一種是將現(xiàn)有的網(wǎng)頁文件另存為模板，然后根據(jù)需要再進行修改；另一種是直接新建一個空白模板，在其中插入需要顯示的文檔內容。模板文件的擴展名是“.dwt”。

模板的制作方法與普通網(wǎng)頁一樣，只是在制作完成后要定義可編輯區(qū)。模板可以通過直接定義來創(chuàng)建，也可以將普通網(wǎng)頁另存為模板，前者在實際應用中更為普遍。在插入可編輯區(qū)域之前，將要插入該區(qū)域的文檔另存為模板。7.4.2創(chuàng)建可編輯區(qū)域7.4.3模板區(qū)域的類型7.4.4創(chuàng)建基于模板的網(wǎng)頁在Dreamweaver中，創(chuàng)建新網(wǎng)頁時，可以直接由模板創(chuàng)建新網(wǎng)頁。前面已經完成了創(chuàng)建模板文件，并在模板中定義了可編輯區(qū)域，下面完成針對可編輯區(qū)域的頁面內容的制作。7.5管理模板7.5.1在基于模板的文檔中編輯內容7.5.2更新模板文件

在Dreamweaver中可以首先創(chuàng)建模板，然后創(chuàng)建基于模板的網(wǎng)頁。這些網(wǎng)頁中部分區(qū)域是不能編輯的，稱為鎖定區(qū)。有些區(qū)域則是可編輯的，稱為可編輯區(qū)。

使用模板的最大好處就在于，當修改模板時，基于該模板創(chuàng)建的所有網(wǎng)頁可以一次更新，這就大大提高了網(wǎng)頁更新維護的效率。模板的高效性不僅在于創(chuàng)建網(wǎng)頁時的批量處理，更體現(xiàn)在修改網(wǎng)頁的時候。對模板進行修改之后，可以將模板的修改應用于所有基于該模板生成的網(wǎng)頁中。本章小結

本章介紹了行為和模板功能及應用方法，讀者可以通過應用行為創(chuàng)建具有動態(tài)效果的網(wǎng)頁，應用模板功能實現(xiàn)統(tǒng)一的多頁面效果。對于一些大中型網(wǎng)站，使用模板可以更好地維護網(wǎng)頁，有利于減輕網(wǎng)站設計中的重復工作量，對于剛剛學習網(wǎng)頁制作的設計者來說，可能會覺得本章的知識用處不是很大，但經過一些實踐創(chuàng)作之后，會感到它們對讀者是很有幫助的。添加行為時對象、事件和動作之間的關系是什么？結合實例解釋。針對IE6.0提供的事件，說明onCli