dreamweaver 基礎(chǔ)教程 多媒體

Dreamweaver網(wǎng)頁(yè)設(shè)計(jì)第7章 應(yīng)用多媒體元素【學(xué)習(xí)概述】在網(wǎng)頁(yè)中應(yīng)用多媒體效果當(dāng)前十分普遍，例如大量使用Flash動(dòng)畫、視頻、聲音、JavaApplet等使網(wǎng)頁(yè)動(dòng)感十足，變化多端。本章內(nèi)容包括插入Flash元素、插入背景音樂(lè)、插入視頻、插入圖像查看器等內(nèi)容。本章的重點(diǎn)是插入Flash元素，難點(diǎn)是插入圖像查看器。7.1 【課堂講解】多媒體基礎(chǔ)7.1.1 什么是FlashFlash是由macromedia公司推出的交互式矢量圖和Web動(dòng)畫的標(biāo)準(zhǔn)。網(wǎng)頁(yè)設(shè)計(jì)者使用Flash創(chuàng)作出既漂亮又可改變尺寸的導(dǎo)航界面以及其他奇特的效果。并且它是矢量的，所以即使放大也不會(huì)出現(xiàn)變形和模糊。這種動(dòng)畫文件體積小，效果華麗，還具有極強(qiáng)地的互動(dòng)效果，甚至有人利用這種技術(shù)制作功能非常強(qiáng)大的游戲。Flash的源文件擴(kuò)展名為“.fla”，生成的用于網(wǎng)絡(luò)上傳輸?shù)腇lash格式為“.swf”。7.1.2 視頻格式視頻格式有很多種，但是在網(wǎng)絡(luò)上應(yīng)用的視頻格式多為：avi、wmv、asf、mpeg、rm、rmvb、mov、Flv等。7.1.3 音頻格式在網(wǎng)絡(luò)上應(yīng)用的音頻格式多為：wav、mp3、aif、midi、ra、ram、rpm等。7.1.4 插入多媒體要在網(wǎng)頁(yè)中添加以上多媒體文件，可以執(zhí)行【插入】->【媒體】下的子菜單命令如圖7-1所示或在“插入”工具欄的“常用”類別中，選擇“媒體”，然后單擊所需的媒體圖標(biāo)按鈕如圖7-2所示。圖7-1【媒體】子菜單圖7-2插入媒體7.2 【典例剖析】一多媒體網(wǎng)頁(yè)效果7.2.1 插入Flash動(dòng)畫目前flash動(dòng)畫備受世人矚目，flash動(dòng)畫被大量地用于網(wǎng)頁(yè)。這種動(dòng)畫文件體積小，效果華麗，還具有極強(qiáng)地的互動(dòng)效果，甚至有人制作功能非常強(qiáng)大的游戲。新建站點(diǎn)“dmt”（站點(diǎn)名稱為“多媒體”），創(chuàng)建網(wǎng)頁(yè)文檔“dmt.htm”。然后創(chuàng)建一個(gè)1行2列的表格，如圖7-4所示。圖7-4一個(gè)1行2列的表格插入Flash動(dòng)畫步驟如下：（1）在第二個(gè)單元格內(nèi)定位光標(biāo)。執(zhí)行【插入】->【媒體】->【Flash】命令或在“插入”工具欄的“常用”類別中，選擇“媒體”，然后單擊“插入Flash”圖標(biāo)按扭。顯示“選擇文件”對(duì)話框，如圖7-5所示。（2）選擇Flash文件（本例為本章目錄下的“banner.swf”文件）。圖7-5“選擇文件”對(duì)話框（3）單擊“確定”按鈕，顯示“對(duì)象標(biāo)簽輔助功能屬性”對(duì)話框，如圖7-6所示。各個(gè)屬性如下： 標(biāo)題：媒體對(duì)象的標(biāo)題。 快捷鍵：輸入等效的鍵盤鍵（一個(gè)字母）。例如，您輸入A作為快捷鍵，則使用“Ctrl+A”鍵在瀏覽器中選擇該對(duì)象。 Tab鍵索引：輸入一個(gè)數(shù)字以指定該對(duì)象的Tab鍵順序。設(shè)置各個(gè)選項(xiàng)如圖。圖7-6“對(duì)象標(biāo)簽輔助功能屬性”對(duì)話框（4）單擊“確定”按鈕，文檔中效果如圖7-7所示。圖7-7文檔中Flash效果（5）選擇該動(dòng)畫，單擊Flash屬性面板中的播放按鈕。Flash動(dòng)畫就可以在文檔中直接播放了，如圖7-8所示。圖7-8在文檔中播放Flash7.2.2 設(shè)置Flash動(dòng)畫的屬性選擇Flash動(dòng)畫后，顯示Flash屬性面板，如圖7-9所示。在這里讀者可以設(shè)置Flash動(dòng)畫的屬性。圖7-9設(shè)置Flash動(dòng)畫屬性名稱：標(biāo)識(shí)影片的名稱，比如命名為“banner”。寬：以像素為單位指定影片的寬度。高：以像素為單位指定影片的高度。文件：Flash文件的路徑。單擊文件夾圖標(biāo)可以選擇一個(gè)文件，或者直接鍵入文件路徑。源文件：指定Flash源文檔（后綴名為.FLA）的路徑。編輯：?jiǎn)?dòng)Flash軟件以編輯FLA文件。重設(shè)大?。褐匦略O(shè)置選定影片的大小。循環(huán)：若選中該選項(xiàng)時(shí)影片將連續(xù)播放；若沒(méi)有選中該選項(xiàng)，則影片在播放一次后即停止播放。自動(dòng)播放：若選中該選項(xiàng)，則在加載頁(yè)面時(shí)自動(dòng)播放影片，一般要選中此項(xiàng)。垂直邊距：指定影片上、下空白的像素?cái)?shù)。水平邊距：指定影片左、右空白的像素?cái)?shù)。品質(zhì)：設(shè)置影片播放期間的質(zhì)量。設(shè)置越高，影片的觀看效果就越好，但速度慢。設(shè)置越低，速度快但影片的觀看效果就越差，“高品質(zhì)”選項(xiàng)是注重外觀而非速度?！白詣?dòng)低品質(zhì)”選項(xiàng)是首先注重速度，然后才是外觀?！白詣?dòng)高品質(zhì)”選項(xiàng)是首先注重品質(zhì)，然后才是速度。比例：影片如何適合在寬度和高度文本框中設(shè)置的尺寸。默認(rèn)值設(shè)置顯示整個(gè)影片。有“無(wú)邊框”和“嚴(yán)格匹配”兩選項(xiàng)。對(duì)齊：設(shè)置影片在頁(yè)面上的對(duì)齊方式。背景顏色：設(shè)置影片的背景顏色。參數(shù)：影片的附加參數(shù)。單擊“參數(shù)”按鈕，顯示“參數(shù)”對(duì)話框，如圖7-10所示。在對(duì)話框中可以設(shè)置多種“參數(shù)—值”。圖7-10“參數(shù)”對(duì)話框插插入入Flash文文本本在Dreamweaver中中可可以以直直接接制制作作并并插插入入Flash文文本本。。Flash文文本本是是動(dòng)動(dòng)態(tài)態(tài)效效果果的的文文本本。。插插入入Flash文文本本的的步步驟驟如如下下：：（1））在在上上面面制制作作的的表表格格中中第第一一個(gè)個(gè)單單元元格格內(nèi)內(nèi)定定位位鼠鼠標(biāo)標(biāo)光光標(biāo)標(biāo)。。（2））在在““插插入入””欄欄的的““常常用用””類類別別中中，，選選擇擇““媒媒體體””，，然然后后單單擊擊““Flash文文本本””圖圖標(biāo)標(biāo)按按扭扭，，或或執(zhí)執(zhí)行行【【插插入入】】->【【媒媒體體】】->【【Flash文文本本】】命命令令。。（3））顯顯示示““插插入入Flash文文本本””對(duì)對(duì)話話框框，，對(duì)對(duì)話話框框中中各各項(xiàng)項(xiàng)屬屬性性設(shè)設(shè)置置如如圖圖7-11所所示示。。圖7-11““插插入入Flash文文本本””對(duì)對(duì)話話框框（4））單單擊擊““確確定定””按按鈕鈕，，顯顯示示““對(duì)象象標(biāo)標(biāo)簽簽輔輔助助功功能能屬屬性性””對(duì)對(duì)話話框框，，對(duì)對(duì)話話框框中中各各項(xiàng)項(xiàng)屬屬性性設(shè)設(shè)置置如如圖圖7-12所所示示。。圖7-12““對(duì)對(duì)象象標(biāo)標(biāo)簽簽輔輔助助功功能能屬屬性性””對(duì)對(duì)話話框框（5））單單擊擊““確確定定””按按鈕鈕。。單單擊擊屬屬性性面面板板中中的的““播播放放””按按鈕鈕，，播播放放效效果果如如圖圖7-13所所示示，，當(dāng)當(dāng)鼠鼠標(biāo)標(biāo)移移動(dòng)動(dòng)到到該該Flash文文本本上上時(shí)時(shí)，，效效果果如如圖圖7-14所所示示。。圖7-13文文檔檔中中播播放放效效果果圖7-14鼠鼠標(biāo)標(biāo)移移動(dòng)動(dòng)到到文文本本效效果果插插入入Flash按按鈕鈕Dreamweaver可可以以快快速速創(chuàng)創(chuàng)建建動(dòng)動(dòng)態(tài)態(tài)Flash按按鈕鈕，，步步驟驟如如下下：：（1））在在文文檔檔中中創(chuàng)創(chuàng)建建表表格格并并定定位位光光標(biāo)標(biāo)，，如如圖圖7-15所所示示。。圖7-15創(chuàng)創(chuàng)建建表表格格并并定定位位光光標(biāo)標(biāo)（2））在在““插插入入””欄欄的的““常常用用””類類別別中中，，選選擇擇““媒媒體體””，，然然后后單單擊擊““Flash按按鈕鈕””圖圖標(biāo)標(biāo)或或執(zhí)執(zhí)行行【【插插入入】】->【【媒媒體體】】->【【Flash按按鈕鈕】】命命令令。。顯顯示示““插插入入Flash按按鈕鈕””對(duì)對(duì)話話框框，，如如圖圖7-16所所示示。。圖7-16““插插入入Flash按按鈕鈕””對(duì)對(duì)話話框框（3））設(shè)設(shè)置置完完成成后后，，單單擊擊確確定定按按鈕鈕。。文文檔檔中中效效果果如如圖圖7-17所所示示。。（4）然然后再連連續(xù)插入入幾個(gè)按按鈕，按按快捷鍵鍵【F12】預(yù)預(yù)覽如圖圖7-18所示示。圖7-17文文檔中Flash圖7-18預(yù)覽覽Flash按按鈕插插入FlashVideoFlashVideo現(xiàn)在在在網(wǎng)站站上非常常流行。。Flash視視頻文文件后綴綴名為““.FLV”。。插入Flash視頻頻是Dreamweaver8版版本新增增加的功功能。插插入Flash視頻頻步驟如如下。（1）在在文檔““dmt.htm”右右邊的空空白單元元格內(nèi)定定位鼠標(biāo)標(biāo)。（2）在在“插入入”欄的的“常用用”類別別中，選選擇“媒媒體”，，然后單單擊“Flashvideo”圖圖標(biāo)或執(zhí)執(zhí)行【插插入】->【媒媒體】->【Flash視頻頻】命令令，顯示示“插入入Flash視視頻”對(duì)對(duì)話框。。（3）在在“插入入Flash視視頻”對(duì)對(duì)話框中中，從““視頻類類型”彈彈出式菜菜單中選選擇“累累進(jìn)式下下載視頻頻”或““流視頻頻”。若若選擇““累進(jìn)式式下載視視頻”；；將Flash視視頻文件件下載到到站點(diǎn)訪訪問(wèn)者的的硬盤上上，然后后播放。。若選擇擇“流視視頻”；；對(duì)Flash視頻內(nèi)內(nèi)容進(jìn)行行流式處處理，邊邊緩沖邊邊播放該該內(nèi)容。。（4）比比如“視視頻類型型”選擇擇“累進(jìn)進(jìn)式下載載視頻””選項(xiàng)：： URL：指指定FLV文件件的路徑徑。 外觀觀：指定定Flash視視頻組件件的外觀觀。 寬度度：以像像素為單單位指定定FLV文件的的寬度。。 高度度：以像像素為單單位指定定FLV文件的的高度。。 自動(dòng)動(dòng)播放：：當(dāng)網(wǎng)頁(yè)頁(yè)打開(kāi)時(shí)時(shí)是否播播放視頻頻。 自動(dòng)動(dòng)重新播播放：指指定播放放控件在在視頻播播放完之之后是否否返回起起始位置置。（5）如如果必要要，提示示用戶下下載FlashPlayer：：在頁(yè)面面中插入入代碼，，該代碼