覺得光是這個問題就有點難描述
通常用wmode=transparent/opaque可以解決
但可能會有延伸的許多問題..
(註:兩個比起來如果不是一定要透明背景,還是opaque效能較佳)
目前官方有解,看起來是在FB.init增加一個hideFlashCallback
http://developers.facebook.com/docs/hideflashcallback/
而且很貼心的有demo可以下載!
測試後放在FB的demo,看起來完全改善這個問題!
http://apps.facebook.com/test_hideflash/index2.php
不過,實際應用到自己的flash會遇到兩個問題
1) 用AS API的Facebook.init,無法加入hideFlashCallback
2) swf寬度滿版的狀況,screenshot圖片會出不來
第一個問題,有可能是本身寫法的關係
=====以下有點雜亂 當做murmur即可=====
因為用facebook as api(目前版本GraphAPI_Web_1_8_1.swc)
目前有FB.JSON.parse is not officially supported by Facebook的問題
所以不確定AS無法用hideFlashCallback是不是也是因為as api尚未更新的關係
解法可以改用JS的FB.init
不過,如果先用JS init,再用as init
hideFlashCallback還是會失效
看官方文件的 FB.init
http://developers.facebook.com/docs/reference/javascript/FB.init/
在as init時設定 status=false (true to fetch fresh status)
然後,需要使用同一個accessToken (由JS傳給AS,AS再init)
但是感覺FB.init還是會被蓋過去,hideFlashCallback失效
以上參考這一篇:
http://stackoverflow.com/questions/10672527/as3-fb-api-how-is-it-possible-to-have-an-accesstoken-before-facebook-init
結論,目前先AS做Facebook.init,JS才FB.init
呼叫兩次init,其實在console還是會有警告/錯誤訊息
FB.init has already been called - this could indicate a problem
但目前還是先使用這個做法
第二個問題,比較容易,也只出現在滿版時才會發生
官方文件切換flash hide或是show是把兩個div改變style.top
因為滿版,flashContent和imageContent都需要在style加上 width:100%
另外,screenshotObject的外面需再加上一個div
<div id="allContent" style="position:relative;">
<div id="flashContent" style="position:absolute; width:100%; top:0;">
<div id="flashHolder"></div>
</div>
<div id="imageContent" style="position:absolute; width:100%; top: -10000px;">
<div id="imgHolder"><img id="screenshotObject" src="images/blank.png" style="margin: 0 auto; display:block;" /></div>
</div>
</div>
當指定screenshotObject寬度時,改用style.width
document.getElementById('screenshotObject').style.width = "100%";
html內容應該還可以再整理一下+jQuery會簡潔些,目前先這樣了XD
實際放上去demo,除了關閉上方對話框會閃一下之外~都還算滿正常的
http://apps.facebook.com/test_hideflash/