08 重溫旅行點滴 - 多媒體的呈現 插入 Flash 動畫 設定自動轉頁 在 Dreamweaver 編輯畫面預覽 Flash 動畫

Presentation on theme: "08 重溫旅行點滴 - 多媒體的呈現 插入 Flash 動畫 設定自動轉頁 在 Dreamweaver 編輯畫面預覽 Flash 動畫"— Presentation transcript:

1 08 重溫旅行點滴 - 多媒體的呈現 插入 Flash 動畫 設定自動轉頁 在 Dreamweaver 編輯畫面預覽 Flash 動畫
通過 IE 的安全性警告使用程式 音效與影片檔案的播放

2 8-1 Flash 動畫效果 隨著網路科技的日新月異，在網頁上放置充滿聲光效果的動畫、音樂或電影已經越來越普遍了！Flash 的出現，無異是為網路多媒體的領域，帶來一場前所未有的革命。

3 插入 Flash 動畫 首先就要介紹如何在 Dreamweaver 中插入 Flash 動畫，在彈指間讓您為平淡無 奇的版面加入活潑的元素。 請進入「映象東京」範例網站，開啟 <index.htm> 檔案，在網站的架構中 這是範例網站首頁，將要放置一個 Flash 動畫當作歡迎畫面，其操作步 驟如下： 請先選取編輯區中剛插入的 <tokyoimage.swf>，並檢視 屬性 面板，其中較為 重要的說明如下：

4 8-1-2 設定自動轉頁 8-1-3 設定背景透明的 Flash 動畫
設定自動轉頁 在進入歡迎首頁後，如果沒有選按直接進入網站 (skip) 鈕，頁面會一直停留在 歡迎首頁上。以下我們便在 Dreamweaver 中設定一些 Flash 屬性，讓頁面在停 留幾秒後，自動轉到內頁去。 設定背景透明的 Flash 動畫 如果 Flash 動畫放置在一個有指定背景顏色的頁面上，而背景色又與 Flash 本身 的背景色不同時，就會令人感到頁面不協調！以下提供於 屬性 面板上二種去除 Flash 動畫本身背景的方法，讓動畫的主體融入網頁指定背景顏色之中。

5 將 屬性 面板的 Wmode 欄設定為 透明。 也可以直接為該 Flash 動畫加入一個 參數，請選取編輯區中的 Flash 檔後， 於 屬性 面板選按 參數 鈕，加入 「wmode」=「transparent」。 完成後請選按功能表列 檔案 \ 儲存檔案，再按 F12 鍵預覽看看。(可開啟 <index.htm>，並替作品換一個較淺的背景顏色再依步驟練習，這樣效果會 較明顯。)

6 8-1-4 在 Dreamweaver 編輯畫面預覽 Flash 動畫

7 通過 IE 的安全性警告使用程式 在完成 Flash 動畫插入後， 除了可以利用 屬性 面板 播放 鈕進行編輯區的預覽 外，也可以直接按 F12 鍵 進行預覽。 在 Dreamweaver 中加入 Flash 等相關的互動式功 能時，使用 IE 瀏覽器開 啟時會自動出現以黃色底 色標示的安全性警告並自 動封鎖程式的執行。如果 不開啟就無法看到頁面上 加入設定的結果。

8 8-2 音效與影片檔案的播放 沉靜無聲的網站已經無法吸引人的注意，充滿聲光效果、影片動畫才是目前設計的主流！想在網頁中插入背景音樂，加入影片播放嗎？全部將在這一節為您介紹：

9 8-2-1 在網頁中加入音效 關於網頁中播放的音效檔案
在網頁中加入音效 無論是音效檔或是影片檔，如果要在瀏覽器上播放都必須依靠瀏覽器的外掛程式， 而目前瀏覽器能夠支援的多媒體檔案可說是越來越多了。 關於網頁中播放的音效檔案 除了一般常使用的 wav、midi...等音效檔外，目前市場上的主流：mp3、wma， 都可以放置到網頁中播放。在這裡特別建議使用 mp3 或 wma...等音樂檔案， 不僅檔案小，表現的音質也更好。

10 加入音效檔的方法 進入「映象東京」範例網站開啟 <about.htm> 檔案，現在要為這一頁加入一段 背景音樂，請依照如下步驟進行操作：

11 如下圖已將音效檔案加到頁面當中，請選按功能表列 檔案 \ 儲存檔案，再按 F12 鍵預覽看看。

12 設定播放區域的大小 在插入媒體檔時，其預設播放區域寬高皆為 「32」，如此也會造成播放區域顯 示不完全的狀況，您可以修改 屬性 面板中的 寬 及 高 來改變顯示區域的大小。 根據測試，如果想要完整顯示預設播放控制列，可以把 寬 及 高 設定為 「280」、「45」，以及 對齊：絕對中間。

13 設定音效檔的屬性 插入音效檔後，可藉由屬性及參數進行一些更進階設定，音效檔常用的屬性整理 如下：

14 在網頁中加入影片 在網頁中加入影片檔，其方法與加入音效檔大同小異，使用的參數也相同，您可 以在幾個簡單的步驟中，將影片快速放置在作品中。 在這一節中說明影片檔格式的加入與設定方法：這裡所要使用的是 FLV 格式的 影片檔。FLV 是指 Flash Video 格式，是目前網路上流行的影片檔格式。 1. 進入「映象東京」範例網站開啟 <medias.htm> 檔案，接著要插入一 FLV 格式影片， 操作步驟如下：

15 2. 如下完成 FLV 影片插入，請選按功 能表列 檔案 \ 儲存檔案，再按 F12 鍵 預覽看看。