使用SWFObject插入Flash在IE下導緻stageWidth為0的解決方法

SWFObject

SWFObject是一個用于在HTML中方面插入Adobe Flash媒體資源（*.swf檔案）的獨立、靈活的JavaScript子產品。該子產品中的JavaScript腳本能夠自動檢測PC、Mac機器上各種主流浏覽器對Flash插件的支援情況。它使得插入Flash媒體資源盡量簡捷、安全。而且它是非常符合搜尋引擎優化的原則的。此外，它能夠避免您的 HTML、XHTML中出現object、embed等非标準标簽，進而符合更加标準。

SWFObject在IE下的BUG

如果Flash裡繪制的對象的寬高是自适應Flash的寬高的，那麼，使用SWFObject來插入Flash在IE會導緻一個問題，當這個Flash被緩存後，也就是第二次通路該頁面時，在該Swf檔案被加載時，擷取到的stage.stageWidth和stage.stageHeight為0，繪制的對象也就看不到了。

在Flash裡監聽resize事件，找出解決方法

如下(如果加載較慢就先等等吧~)：

檢視示範

用IE的話，會看到5行，有兩次resize事件，這也就導緻了Flash在加載的時候繪制對象錯誤(寬和高為0)：

數字是stage.stageWidth和stage.stageHeight

info

resize

0 x 0

resize

300 x 300

如果用Firefox等浏覽器，隻輸出兩行文字，沒有resize事件：

info

300 x 300

AS裡的解決方案

通過監聽resize事件，當stage.stageWidth和stage.stageHeight大于0時再進行初始化

package {

    import flash.display.Sprite;

    import flash.events.Event;

    import flash.text.TextField;

    import flash.display.StageAlign;

    import flash.display.StageScaleMode;

    public class AutoSizeExample extends Sprite

    {

        private var txt:TextField;

        public function AutoSizeExample()

        {

            stage.align = StageAlign.TOP_LEFT;

            stage.scaleMode = StageScaleMode.NO_SCALE;

            txt = new TextField();

            txt.multiline = true;

            txt.wordWrap = true;

            txt.text = "info\n";

            addChild(txt);

            if (stage.stageWidth>0 && stage.stageHeight>0){

                createChild();

            }else{

                stage.addEventListener(Event.RESIZE,onResize);

            }

        }

        private function onResize(e:Event):void

        {

            if (stage.stageWidth>0 && stage.stageHeight>0){

                stage.removeEventListener(Event.RESIZE,onResize); //删除事件監聽

                createChild();

            }

            //否則繼續監聽事件，直到stage.stageWidth和stage.stageHeight大于0時才初始化

        }

        private function createChild():void

        {

            //進行初始化操作，建立各對象

            //.......................

            var w:Number = stage.stageWidth;

            var h:Number = stage.stageHeight;

            txt.appendText(w + " x " + h + "\n");

        }

    }

}

SWFObject.js裡的解決方案

在swfobject.js裡找到函數function createSWF(attObj, parObj, id)

裡面針對winIE的處理方法是：el.outerHTML = '<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"' + att + '>' + par + '</object>';

看了一下Adobe自己的AC_OETags.js，他是用document.write方法直接寫入，沒有這個問題；

直接寫靜态html(object)沒有這種問題；

直接通路這個flash的位址，也沒有這種問題。

至于el.outerHTML的方式為什麼會導緻這種問題，還沒有深究，暫時還不太清楚是什麼原因導緻的~

待續~~~