1、Dreamweaver 網(wǎng)頁設(shè)計,第5章應(yīng)用多媒體元素,【學習概述】,在網(wǎng)頁中應(yīng)用多媒體效果當前十分普遍，例如大量使用Flash動畫、視頻、聲音等使網(wǎng)頁動感十足，變化多端。本章內(nèi)容包括插入Flash元素、插入背景音樂、插入視頻、插入圖像查看器等內(nèi)容。本章的重點是插入Flash元素，難點是插入圖像查看器。,5.1【課堂講解】多媒體基礎(chǔ),5.1.1什么是Flash Flash 是由macromedia公司推出的交互式矢量圖和 Web 動畫的標準。網(wǎng)頁設(shè)計者使用 Flash 創(chuàng)作出既漂亮又可改變尺寸的導航界面以及其他奇特的效果。并且它是矢量的，所以即使放大也不會出現(xiàn)變形和模糊。這種動畫文件體積小，效

2、果華麗，還具有極強地的互動效果，甚至有人利用這種技術(shù)制作功能非常強大的游戲。Flash的源文件擴展名為“.fla”，生成的用于網(wǎng)絡(luò)上傳輸?shù)腇lash格式為“.swf”。 5.1.2視頻格式 視頻格式有很多種，但是在網(wǎng)絡(luò)上應(yīng)用的視頻格式多為：avi、wmv、asf、 mpeg、rm、rmvb、mov、Flv等。 5.1.3音頻格式 在網(wǎng)絡(luò)上應(yīng)用的音頻格式多為：wav、mp3、aif、midi、ra、ram、rpm等。,5.1.4插入多媒體 要在網(wǎng)頁中添加以上多媒體文件，可以執(zhí)行【插入】-【媒體】下的子菜單命令如圖5-1所示或在“插入”工具欄的“常用”類別中，選擇“媒體”，然后單擊所需的媒體圖標按

3、鈕如圖5-2所示。,圖 5-1【媒體】子菜單,圖5-2 插入媒體,5.2【典例剖析】一多媒體網(wǎng)頁效果,5.2.1插入Flash動畫 目前flash動畫備受世人矚目，flash動畫被大量地用于網(wǎng)頁。這種動畫文件體積小，效果華麗，還具有極強地的互動效果，甚至有人制作功能非常強大的游戲。 新建站點“dmt”（站點名稱為“多媒體”），創(chuàng)建網(wǎng)頁文檔“dmt.htm”。然后創(chuàng)建一個1行2列的表格，如圖5-4所示。,圖5-4 一個1行2列的表格,插入Flash動畫步驟如下： （1）在第二個單元格內(nèi)定位光標。執(zhí)行【插入】-【媒體】-【Flash】命令或在“插入”工具欄的“常用”類別中，選擇“媒體”，然后單擊“

4、插入 Flash”圖標按扭。顯示“選擇文件”對話框，如圖5-5所示。 （2）選擇Flash文件（本例為本章目錄下的“banner.swf”文件）。,圖5-5 “選擇文件”對話框,（3）單擊“確定”按鈕，顯示“對象標簽輔助功能屬性”對話框.,（4）單擊“確定”按鈕，文檔中效果如圖5-5所示。,圖5-5 文檔中Flash效果,（5）選擇該動畫，單擊Flash屬性面板中的播放按鈕。Flash動畫就可以在文檔中直接播放了，如圖5-8所示。,圖5-8 在文檔中播放Flash,5.2.2設(shè)置Flash動畫的屬性 選擇Flash動畫后，顯示Flash屬性面板，如圖5-9所示。在這里讀者可以設(shè)置Flash動畫

5、的屬性。,圖5-9設(shè)置Flash動畫屬性,名稱：標識影片的名稱，比如命名為“banner”。 寬：以像素為單位指定影片的寬度。 高：以像素為單位指定影片的高度。 文件： Flash文件的路徑。單擊文件夾圖標可以選擇一個文件，或者直接鍵入文件路徑。 源文件：指定 Flash 源文檔（后綴名為.FLA）的路徑。 編輯：啟動 Flash軟件以編輯FLA文件。 重設(shè)大小：重新設(shè)置選定影片的大小。,循環(huán)：若選中該選項時影片將連續(xù)播放；若沒有選中該選項，則影片在播放一次后即停止播放。 自動播放：若選中該選項，則在加載頁面時自動播放影片，一般要選中此項。 垂直邊距：指定影片上、下空白的像素數(shù)。 水平邊距：指

6、定影片左、右空白的像素數(shù)。 品質(zhì)：設(shè)置影片播放期間的質(zhì)量。設(shè)置越高，影片的觀看效果就越好，但速度慢。設(shè)置越低，速度快但影片的觀看效果就越差，“高品質(zhì)”選項是注重外觀而非速度。“自動低品質(zhì)”選項是首先注重速度，然后才是外觀。“自動高品質(zhì)”選項是首先注重品質(zhì)，然后才是速度。 比例：影片如何適合在寬度和高度文本框中設(shè)置的尺寸。默認值設(shè)置顯示整個影片。有“無邊框”和“嚴格匹配”兩選項。 對齊：設(shè)置影片在頁面上的對齊方式。 背景顏色：設(shè)置影片的背景顏色。 參數(shù)：影片的附加參數(shù)。單擊“參數(shù)”按鈕，顯示“參數(shù)”對話框，如圖5-10所示。在對話框中可以設(shè)置多種“參數(shù)值”。,圖5-10 “參數(shù)”對話框,5.2.

7、3插入Flash文本 在Dreamweaver中可以直接制作并插入Flash文本。Flash文本是動態(tài)效果的文本。插入Flash文本的步驟如下： （1）在上面制作的表格中第一個單元格內(nèi)定位鼠標光標。 （2）在“插入”欄的“常用”類別中，選擇“媒體”，然后單擊“Flash文本”圖標 按扭，或執(zhí)行【插入】-【媒體】-【Flash文本】命令。 （3）顯示“插入 Flash 文本”對話框，對話框中各項屬性設(shè)置如圖5-11所示。,圖5-11 “插入 Flash 文本”對話框,（4）單擊“確定”按鈕，顯示“對象標簽輔助功能屬性”對話框，對話框中各項屬性設(shè)置如圖5-12所示。,圖5-12 “對象標簽輔助功能

8、屬性”對話框,（5）單擊“確定”按鈕。單擊屬性面板中的“播放”按鈕，播放效果如圖5-13所示，當鼠標移動到該Flash文本上時，效果如圖5-14所示。,圖5-13 文檔中播放效果,圖5-14 鼠標移動到文本效果,5.2.4插入Flash按鈕 Dreamweaver可以快速創(chuàng)建動態(tài)Flash按鈕，步驟如下： （1）在文檔中創(chuàng)建表格并定位光標，如圖5-15所示。,圖5-15創(chuàng)建表格并定位光標,（2）在“插入”欄的“常用”類別中，選擇“媒體”，然后單擊“Flash 按鈕”圖標或執(zhí)行【插入】-【媒體】-【Flash 按鈕】命令。 顯示“插入 Flash 按鈕”對話框，如圖5-16所示。,圖5-16“插

9、入 Flash 按鈕”對話框,（3）設(shè)置完成后，單擊確定按鈕。文檔中效果如圖5-15所示。 （4）然后再連續(xù)插入幾個按鈕，按快捷鍵【F12】預覽如圖5-18所示。,圖5-15 文檔中Flash,圖5-18預覽Flash 按鈕,5.2.5插入Flash Video Flash Video現(xiàn)在在網(wǎng)站上非常流行。Flash 視頻文件后綴名為“.FLV”。插入Flash視頻是Dreamweaver 8版本新增加的功能。插入Flash 視頻步驟如下。 （1）在文檔“dmt.htm”右邊的空白單元格內(nèi)定位鼠標。 （2）在“插入”欄的“常用”類別中，選擇“媒體”，然后單擊“Flash video”圖標或執(zhí)行

10、【插入】-【媒體】-【Flash視頻】命令，顯示“插入Flash視頻”對話框。 （3）在“插入Flash視頻”對話框中，從“視頻類型”彈出式菜單中選擇“累進式下載視頻”或“流視頻”。若選擇“累進式下載視頻”；將 Flash 視頻文件下載到站點訪問者的硬盤上，然后播放。若選擇“流視頻”；對Flash視頻內(nèi)容進行流式處理，邊緩沖邊播放該內(nèi)容。 （4）比如“視頻類型”選擇“累進式下載視頻”選項： URL：指定FLV文件的路徑。 外觀：指定Flash視頻組件的外觀。 寬度：以像素為單位指定FLV文件的寬度。 高度：以像素為單位指定FLV文件的高度。 自動播放：當網(wǎng)頁打開時是否播放視頻。 自動重新播放：指定播放控件在視頻播放完之后是否返回起始位置。,（5）如果必要，提示用戶下載 Flash Player：在頁面中插入代碼，該代碼將檢測查看Flash視頻所需的Flash Player版本，并在用戶沒有所