把非透明swf動畫dreamweaver作成透明背景flash動畫方法

記錄如何把非透明swf動畫在dreamweaver作成透明flash動畫方法。今天飛龍作公司網站,橫幅廣告條banners需處理成動畫形式,但要求能簡便地更換動畫背景圖片。若是每換一次背景圖片都用flash8處理,那就太麻煩了,因此必須想辦法作透明flash動畫。思路是,把背景圖片疊加在div層背景上;而後把透明flash動畫插入該div層。 css

想到製做思路就尋解決方法。先在flash8裏把已有背景圖片層拿掉,但文件屬性沒法設置背景爲透明,而alpha值只適合flash對象,不適合flash背景色。飛龍知道若是把flash動畫轉爲gif格式(方法參考:http://feilong.org/swf-gif),那就和直接用帶背景flash動畫沒啥區別,就不是飛龍這裏談到透明flash疊加在層背景上的作法。到底如何作透明flash動畫呢?飛龍想看dreamweaver8裏有沒有把非透明swf動畫dreamweaver作成透明背景flash動畫方法。探索之路開始,此文修訂地址:http://feilong.org/dreamweaver-transparent-flash-swf-background 。作個記錄,供你們參考。 html

1、 說幹就幹,先作一個div層,設置總高72和總寬780,在css樣式裏面設置層背景。代碼以下:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 瀏覽器

"http://www.w3.org/TR/html4/loose.dtd"> app

<html> 動畫

<head> 網站

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> ui

<title>如何作透明flash第一步</title> url

<style type="text/css"> spa

<!-- 設計

#banner {height: 56px;width: 780px;background-image: url(http://e.jiaju99.com/efiles/jiaju99poem.jpg);}

-->

</style>

</head>

<body>

<div id="banner">此處即將插入透明flash動畫</div>

</body>

</html>

2、 直接插入去掉了背景圖片層的非透明flash動畫。id爲banner的層裏面「此處即將插入透明flash動畫」文字變爲:

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="780" height="72">

<param name="movie" value="efiles/banner.swf">

<param name="quality" value="high">

<embed src="efiles/banner2.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="780" height="72"></embed>

</object>

3、 按F12在瀏覽器裏面看效果,發現非透明flash動畫把圖片背景給遮住了。怎麼辦了?查看dereamweaver8幫助,找到這麼一些資料:

設置 Flash 和 Shockwave 影片屬性....若要查看全部 Flash SWF 文件屬性,請單擊屬性檢查器右下角的擴展箭頭。

「名稱」指定用來標識影片以進行腳本撰寫的名稱。在屬性檢查器最左側的未標記文本框中輸入名稱。

「寬」和「高」以像素爲單位指定影片的寬度和高度。

「文件」指定指向 Flash 或 Shockwave 文件的路徑。

「源文件」指定 Flash 源文檔 (FLA) 的路徑..。

「編輯」容許您啓動 Flash 以更新 FLA 文件..。

「重設大小」將選定影片返回到其初始大小。

「循環」,在選中該選項時影片將連續播放;

「自動播放」,若是選中該選項,則在加載頁面時自動播放影片..。

「垂直邊距」和「水平邊距」指定影片上、下、左、右空白的像素數..。

「品質」在影片播放期間控制抗失真。設置越高,影片的觀看效果就越好..。

「比例」肯定影片如何適合在寬度和高度文本框中設置的尺寸。「默認值」顯示整個影片。

「無邊框」使影片適合設定的尺寸,所以無邊框顯示並維持原始的縱橫比。

「嚴格匹配」對影片進行縮放以適合設定的尺寸,而無論縱橫好比何。

「對齊」肯定影片在頁面上的對齊方式。有關每一對齊選項的說明,請參見對齊圖像。

「背景顏色」指定影片區域的背景顏色。在不播放影片時(在加載時和在播放後)也顯示此顏色。

「參數」打開一個對話框,可在其中輸入傳遞給影片的附加參數。有關添加或刪除參數的更多信息,請參見使用參數控制媒體對象。影片必須已設計好,能夠接收這些附加參數。

4、 咦,背景顏色改爲黑色後,flash製做的原背景色變成黑色,看來能夠用dreamweaver處理flash背景!可是很遺憾裏面沒有透明色。怎麼辦?dreamweaver怎麼製做透明flash動畫背景?

五 看到最後,發現了一線新但願:參數」打開一個對話框,可在其中輸入傳遞給影片的附加參數。有關添加或刪除參數的更多信息,請參見使用參數控制媒體對象。哈哈,看有沒有用參數來控制背景爲透明色呢?飛龍知道這兩行代碼是默認狀態下參數:

<param name="movie" value="efiles/banner.swf">

<param name="quality" value="high">

有沒有用參數控制flash動畫背景爲透明色?「屬性--參數」裏沒提示,只好找網上資料。發現這麼一個參數:  <param name="wmode" value="transparent">    立刻放裏面看看?哈哈,終於把非透明的flash動畫中dreamweaver裏面設置成透明flash動畫啦。ok~~

5、 飛龍提供背景是透明的flash動畫方法的最終代碼以下:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

"http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>如何作透明flash方法步步尋</title>

<style type="text/css">

<!--

#banner {height: 56px;width: 780px;background-image: url(http://e.jiaju99.com/efiles/jiaju99poem.jpg);}

-->

</style>

</head>

<body>

<div id="banner">

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="780" height="72">

<param name="movie" value="http://e.jiaju99.com/efiles/banner.swf">

<param name="quality" value="high"><param name="wmode" value="transparent">

<embed src="efiles/banner2.swf" quality="high"

pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="780" height="72"></embed>

</object>

</div>

</body>

</html>

6、 效果預覽參考:http://e.jiaju99.com/background-flash.htm

相關文章
相關標籤/搜索