動態(tài)網(wǎng)頁技術_第1頁
動態(tài)網(wǎng)頁技術_第2頁
動態(tài)網(wǎng)頁技術_第3頁
動態(tài)網(wǎng)頁技術_第4頁
動態(tài)網(wǎng)頁技術_第5頁
已閱讀5頁，還剩56頁未讀， 繼續(xù)免費閱讀

下載本文檔

版權說明：本文檔由用戶提供并上傳，收益歸屬內容提供方，若內容存在侵權，請進行舉報或認領

文檔簡介

動態(tài)網(wǎng)頁技術第1頁，共61頁，2023年，2月20日，星期三設置Flash對象的屬性

9.2彈出消息

9.4“行為”簡介9.3添加內置的Flash對象

9.1第2頁，共61頁，2023年，2月20日，星期三轉到URL

9.5實踐與練習：打開瀏覽器窗口

9.6實踐與練習：在狀態(tài)欄顯示消息

9.7實踐與練習：交換圖像與恢復交換圖像

9.8第3頁，共61頁，2023年，2月20日，星期三實踐與練習：調用JavaScript9.9小結

實踐與練習：圖層拖動

9.10第4頁，共61頁，2023年，2月20日，星期三本章將通過對制作翻滾圖的介紹引入了動態(tài)網(wǎng)頁技術，主要對添加內置的Flash交互對象和使用行為進行介紹，綜合運用了各種動態(tài)網(wǎng)頁制作技術，使讀者能夠將所學知識融會貫通。第5頁，共61頁，2023年，2月20日，星期三在這一章中，讀者應重點理解和掌握Dreamweaver特有的“行為”概念，它是Dreamweaver中最有特色的功能，能大大提高網(wǎng)頁制作的效率。通過本章的學習，讀者可以掌握幾種動態(tài)網(wǎng)頁技術，制作出有動態(tài)效果的網(wǎng)頁，將單一、死板的樣式變得更加豐富多彩、引人入勝。第6頁，共61頁，2023年，2月20日，星期三9.1添加內置的Flash對象

Macromedia公司開發(fā)（現(xiàn)已被Adobe公司收購）的Flash技術是當前網(wǎng)絡上傳輸矢量動畫的主要解決方案。在Dreamweaver中使用Flash命令之前，應先熟悉下面兩個Flash的不同文件格式。第7頁，共61頁，2023年，2月20日，星期三

Flash文件（.fla）是Flash程序的源文件。

Flash動畫文件（.swf）是一種壓縮過的Flash文件格式。第8頁，共61頁，2023年，2月20日，星期三9.1.1使用Flash按鈕對象圖9-1打開“插入Flash按鈕”對話框

第9頁，共61頁，2023年，2月20日，星期三9.1.2使用Flash文本對象使用Flash文本對象可以創(chuàng)建和插入一個Flash電影，在這個電影中包含了文本動畫效果。第10頁，共61頁，2023年，2月20日，星期三圖9-3“插入Flash文本”對話框第11頁，共61頁，2023年，2月20日，星期三9.2設置Flash對象的屬性在按照上面介紹的步驟給網(wǎng)頁加入Flash對象以后，還可以通過“屬性”面板設置FlashSWF文件的所有屬性。選擇菜單欄“窗口→屬性”命令，打開“屬性”面板，如圖9-4所示。第12頁，共61頁，2023年，2月20日，星期三圖9-4“屬性”面板第13頁，共61頁，2023年，2月20日，星期三9.3“行為”簡介

Dreamweaver中的“行為”實際上是一些JavaScript的程序，它由事件和動作兩部分組成。動作是特定的JavaScript程序，在某個特定的事件發(fā)生（如頁面加載或者鼠標單擊）后，相應的程序就會自動運行。在這一節(jié)中，將講解行為的基本概念，并以幾種常用的行為為例，進行詳細的說明。第14頁，共61頁，2023年，2月20日，星期三行為是Dreamweaver中最有特色的功能，通過使用它，用戶可以不用編寫JavaScript代碼，就能制作出需要由數(shù)百行代碼才能完成的功能。行為的關鍵在于Dreamweaver提供了許多標準的JavaScript程序，這些程序被稱為動作。第15頁，共61頁，2023年，2月20日，星期三每個動作都可以完成特定的任務，這樣如果所需要的功能在這些動作中，就不必編寫JavaScript程序了。另外Dreamweaver使用了開放結構，即任何人都可以開發(fā)出外掛插件。第16頁，共61頁，2023年，2月20日，星期三9.3.1“行為”的本質行為是一系列使用JavaScript程序預定義的頁面特效工具，是JavaScript在Dreamweaver中內置的程序庫。使用程序庫中的腳本或程序，通常鑒于以下兩種目的：第17頁，共61頁，2023年，2月20日，星期三（1）通過與服務器的交互執(zhí)行復雜的數(shù)據(jù)處理，這通常需要執(zhí)行服務器端的腳本或程序。（2）實現(xiàn)簡單頁面中的交互控制，這就要使用客戶端的腳本或程序。第18頁，共61頁，2023年，2月20日，星期三

Dreamweaver既有客戶端的“行為”，也有服務器端的“行為”，但是由于本書面向的是網(wǎng)頁設計人員，而非后臺的程序開發(fā)人員，因此本書重點介紹客戶端的“行為”功能，在后面再簡要介紹服務器端行為。通過行為，可以為頁面制作出各種各樣的動態(tài)交互效果，如交換圖像、彈出信息和拖動層等效果。第19頁，共61頁，2023年，2月20日，星期三9.3.2“行為”的構成一般來說，一個“行為”由一個“事件”和一個“動作”所組成。1．動作“動作”通常是一段JavaScript程序，利用這段程序可以完成相應的任務，比如彈出信息、播放聲音和檢查瀏覽器等。第20頁，共61頁，2023年，2月20日，星期三2．事件“事件”通常由瀏覽器所定義，它可以被附加到各種頁面元素對象上，也可以被附加到HTML標簽中，比如附加到“<body>”標簽。第21頁，共61頁，2023年，2月20日，星期三3．事件和動作的組合將事件和動作結合起來，就構成了“行為”。第22頁，共61頁，2023年，2月20日，星期三9.4彈出消息有時希望訪問者一進入首頁就看到一些最新消息，可以彈出一個消息框，或顯示一些文本，如圖9-5所示。第23頁，共61頁，2023年，2月20日，星期三圖9-5IE中彈出的消息框

第24頁，共61頁，2023年，2月20日，星期三圖9-6設定彈出的消息框中的文本

第25頁，共61頁，2023年，2月20日，星期三圖9-7加入動作后的“行為”面板

第26頁，共61頁，2023年，2月20日，星期三圖9-8IE中彈出的消息框

第27頁，共61頁，2023年，2月20日，星期三9.5轉到URL這個行為可以使瀏覽器裝載新頁面，而不必等訪問者單擊了鏈接時才跳轉。例如當網(wǎng)站更換了地址，就可以把原地址的首頁制作成如圖9-9所示的樣子，當訪問者瀏覽此頁面時就會從這個頁面跳轉到新地址。如果訪問者用的瀏覽器不支持這項功能，就可以根據(jù)提示單擊鏈接，手動進入新地址。目前絕大多數(shù)實際用戶都使用支持該功能的瀏覽器，都可以實現(xiàn)自動跳轉。第28頁，共61頁，2023年，2月20日，星期三圖9-9自動跳轉到其他地址第29頁，共61頁，2023年，2月20日，星期三圖9-10設定跳轉到的目標URL

第30頁，共61頁，2023年，2月20日，星期三圖9-11“行為”面板

第31頁，共61頁，2023年，2月20日，星期三9.6實踐與練習：打開瀏覽器窗口很多網(wǎng)站為了吸引用戶的注意，常常在打開首頁的同時彈出一個瀏覽器窗口，用于顯示通知信息和廣告信息等。根據(jù)設計的不同需要，這些窗口的大小和形態(tài)各異。第32頁，共61頁，2023年，2月20日，星期三這種效果通過Dreamweaver的“行為”功能十分容易實現(xiàn)，它用到的是“打開瀏覽器窗口”行為。使用該行為，可以自定義打開文檔的窗口形式，比如自定義窗口的尺寸大小，自定義窗口是否具有菜單欄、標準工具欄和地址欄，自定義是否允許用戶調整窗口大小等。第33頁，共61頁，2023年，2月20日，星期三圖9-12“打開瀏覽器窗口”對話框第34頁，共61頁，2023年，2月20日，星期三9.7實踐與練習：在狀態(tài)欄顯示消息這個動作與后面的“彈出消息”類似，不同的是如果用消息框顯示文本，訪問者必須單擊消息框中的按鈕，才能繼續(xù)瀏覽；而在狀態(tài)欄顯示文本不會影響訪問者的瀏覽，因此通常用onMouseOver事件與此動作配合。在狀態(tài)欄顯示消息的實例的制作方法如下。第35頁，共61頁，2023年，2月20日，星期三圖9-13設定狀態(tài)欄消息的文本

第36頁，共61頁，2023年，2月20日，星期三圖9-14加入動作后的“行為”面板

第37頁，共61頁，2023年，2月20日，星期三9.8實踐與練習：交換圖像與恢復交換圖像圖9-16所示是網(wǎng)頁通常的顯示效果，中間的小鳥圖片色調很淡，當鼠標指針移動到小鳥圖片的范圍內時，圖片變清晰，如圖9-17所示，這個效果可以經常在網(wǎng)頁中見到。第38頁，共61頁，2023年，2月20日，星期三圖9-16交互前的頁面顯示

第39頁，共61頁，2023年，2月20日，星期三圖9-17交互后的頁面顯示第40頁，共61頁，2023年，2月20日，星期三圖9-18插入圖像

第41頁，共61頁，2023年，2月20日，星期三圖9-19圖像“屬性”面板第42頁，共61頁，2023年，2月20日，星期三圖9-20“行為”菜單

第43頁，共61頁，2023年，2月20日，星期三圖9-21“交換圖像”對話框

第44頁，共61頁，2023年，2月20日，星期三圖9-22添加“交換圖像”和

“恢復交換圖像”行為第45頁，共61頁，2023年，2月20日，星期三9.9實踐與練習：調用JavaScript使用“調用JavaScript”行為，可以為文檔或者文檔中的元素對象添加一個JavaScript程序段，當特定事件發(fā)生時，該JavaScript程序段將會得到執(zhí)行。調用JavaScript實例的制作方法如下。第46頁，共61頁，2023年，2月20日，星期三圖9-24“調用JavaScript”對話框

第47頁，共61頁，2023年，2月20日，星期三圖9-25“行為”面板第48頁，共61頁，2023年，2月20日，星期三圖9-26雙擊頁面文本第49頁，共61頁，2023年，2月20日，星期三9.10實踐與練習：圖層拖動層作為一種頁面元素對象的定位工具，與表格相比具有更大的靈活性，它不僅能夠在編輯狀態(tài)下隨意移動和調整位置，使層內被控制的對象能夠在頁面的任一坐標位置放置，而且還能夠在頁面被瀏覽器加載執(zhí)行后，被鼠標隨意地拖動。當然，這不是僅用層就能夠完成的，還需借助于行為。使用層的這種特性，可以制作出很多五彩繽紛的效果，比如拼圖游戲、猜謎游戲和挑選物件游戲等。第50頁，共61頁，2023年，2月20日，星期三圖9-27拼圖游戲第51頁，共61頁，2023年，2月20日，星期三圖9-28插入并設置圖層

第52頁，共61頁，2023年，2月20日，星期三圖9-29在層中插入表格

第53頁，共61頁，2023年，2月20日，星期三圖9-30設置表格第54頁，共61頁，2023年，2月20日，星期三圖9-31在圖層中插入圖片第55頁，共61頁，2023年，2月20日，星期三圖9-32“拖動層”對話框第56頁，共61頁，2023年，2月20日，星期三圖9-33確定放下目標的左坐標、上坐標及靠齊距離第57頁，共61頁，2023年，2月20日，星期三圖9-34“高級”選項卡第58頁，共61頁，2023年，2月20日，星期三圖9-35

溫馨提示

  • 1. 本站所有資源如無特殊說明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請聯(lián)系上傳者。文件的所有權益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙，網(wǎng)頁內容里面會有圖紙預覽，若沒有圖紙預覽就沒有圖紙。
  • 4. 未經權益所有人同意不得將文件中的內容挪作商業(yè)或盈利用途。
  • 5. 人人文庫網(wǎng)僅提供信息存儲空間，僅對用戶上傳內容的表現(xiàn)方式做保護處理，對用戶上傳分享的文檔內容本身不做任何修改或編輯，并不能對任何下載內容負責。
  • 6. 下載文件中如有侵權或不適當內容，請與我們聯(lián)系，我們立即糾正。
  • 7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

評論

0/150

提交評論