AS2呼叫Javascript隱藏(/顯示)指定的Div

有時候我們會在yahoo或其它網站看到Flash的廣告banner在畫面中播放完後自動向上收回去，這效果滿有趣的，因為你可以讓大家看到一個比較完整的廣告效果，然後向上縮回，只留下另一個小廣告banner在同一個位置，不會讓大的廣告banner一直佔據網頁的空間。

其實，這只是在同一個地方放了兩個banner，一個大的、一個小的，播完大banner以後再留下小banner；我們可以用兩個div分別置放大、小banner，然後把播完廣告的大banner在畫面中刪除！

或者，也可以在同一個swf檔裡做兩個banner，在播完大banner之後，讓時間軸跳到小banner的地方，不讓別人看到原來大banner的畫面。

不過，這些都不是困難的問題，我們比較好奇的是，是什麼原因讓大banner播完後，Firefox竟然忘不了這個大banner曾經播放過的事實，因此留下原本大banner的「透明」區塊在畫面之中？！也許這層透明區塊不會對畫面造成影響，但另一個問題是…區塊底下的東西竟然無法點選、連結？！這個可麻煩了！真不知道該怎麼辦才好…

沒關係，感謝Javascript和CSS的強大功能，因為我們可以在Flash中呼叫Javascript功能，讓Javascript使用CSS設定，讓指定的Div消失於無形～！哈哈哈！！！

首先我們要讓Flash在特定的時間或事件之中觸發Javascript機制，例如播完影片之後，或者因為我們已經看過這個畫面，不想再看了！於是，我們可以在時間軸中加上底下的Actionscript(AS2)：

getURL("javaScript:hideItem('hideThisDiv');","");
//讓Javascript知道要隱藏哪個Div

接著在html加入底下這段Javascript即可讓Flash自動隱藏起來：

<script type="text/javascript">
<!--
function hideItem(divID) {
hiddenID = document.getElementById(divID);
hiddenID.style.display = "none";
}
//-->
</script>

既然Javascript是用CSS的方式將Div隱藏起來(display:none;)，我們同樣也可以把它叫出來，只要將「none」改為「block」(或其它非none的參數應該都可行)：

hiddenID.style.display = "block";

解決swf重疊的問題

前陣子同事遇到一個情形就是好幾個swf的flash元件重疊在一起，結果會造成顯示畫面的錯亂…特別是當我們指定某個影片一定要在最上面播放的時候…

原來我們想說是z-index的問題，雖然說z-index的設定得配合使用「position:absolute;」才行，但這點似乎無法解決我們的問題。

在經過一番Google之後，一時間也沒什麼答案，但我們的哈學長居然找到了一個很可能解決的答案，而且，最重要的是這答案確實是讓我們的影片顯示在畫面的最上層，不會被其它swf擋住。

更有趣的是，這方法竟然很簡單，只要將你想放在最上層的swf加上「透明度(transparent)」參數設定，並且確定其它swf「沒有」同時使用透明度設定；此時瀏覽器便使將設有透明度的swf放在最上層。swf的透明度參數設定如下：

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

假如其它swf也有使用這個透明度設定的話，一樣會造成顯示上的問題。也因並如此，沒必要的話最好不要在swf上有太多重疊的東西，否則很容易會有問題的發生…

AS2影片播放完畢後執行特定動作

今天在公司試著想把Flash的影片在一開始的時間不要自動播放，讓使用者想看的時候再按下預覽視窗裡面的播放箭頭才播放影片；由於公司使用的是Flash 8，想當然爾，自然是用AS2來達到這個功能。做法如下：

首先將Flash的影片播放組件命名my_FLVPlybk為它的實體名稱。在影片的第一個影格事先放置示意的圖案，並命名為preview_btn。當我們按下這個預覽按鈕時，就告訴Flash把影片帶至第二個影格(設定影格名稱為theVideo)停住，並按放影片播放組件所指定的影片畫面。

第一個影格的as2程式碼：

preview_btn.onRelease = function(){
this._parent.gotoAndStop("theVideo");
//告訴flash到上一層時間軸的「theVideo」停住
}

//當flash到theVideo的時候，會觸發該時間軸上預先設定的AS2程式。至於「theVideo」這個時間點上的時間軸程式語法如下，原則上是使用listenerObject來監聽一些動作：

import mx.video.*;
var listenerObject:Object = new Object();
listenerObject.stopped = function(eventObject:Object):Void {
gotoAndStop("theVideo");
到指定的時間軸位置停住不播放。
};
my_FLVPlybk.contentPath = "myvideo.flv";
//指定my_FLVPlybk這個影片播放程式的位置。
my_FLVPlybk.setBufferTime(7);
my_FLVPlybk.addEventListener("stopped", listenerObject);

基本上就是在影片播完「停住」以後才會觸發另外的動作，如果是要影片在完成(complete)播放後觸發某些動作，也可以使用底下的as2程式碼：

import mx.video.*;
var listenerObject:Object = new Object();
listenerObject.complete = function(eventObject:Object):Void {
gotoAndStop("theVideo");
};
my_FLVPlybk.contentPath = "myvideo.flv";
my_FLVPlybk.setBufferTime(7);
my_FLVPlybk.addEventListener("complete", listenerObject);