Flash全屏功能測試
來源:互聯網
上載者:User
Flash全屏功能測試
線上測試頁面:http://www.klstudio.com/demo/as/fullscreen/fullscreen.html
相關資料檔案:http://www.klstudio.com/demo/as/fullscreen/fullscreen.rar
<div id="flashcontent"></div>
<script language="javascript" src="js/swfobject.js"></script>
<script language="JavaScript">
var orginFlash = {init:false,isFullScreen:false,position:"",top:"",left:"",width:"",height:""};
function writeFlash(){
var so = new SWFObject("fullscreen.swf", "fplayer", "100%", "100%", 8, "#FFFFFF");
so.addParam("quality", "high");
so.addParam("swLiveConnect", "true");
so.addParam("menu", "false");
so.addParam("allowScriptAccess", "sameDomain");
so.addParam("allowFullScreen", "true");
so.write("flashcontent");
}
function getScreenSize(){
var w = 0;
var h = 0;
if( typeof( window.innerWidth ) == 'number' ) {
w = window.innerWidth;
h = window.innerHeight;
} else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
w = document.documentElement.clientWidth;
h = document.documentElement.clientHeight;
} else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
w = document.body.clientWidth;
h = document.body.clientHeight;
}
return {width:w,height:h};
}
function fullScreen(){
if(!orginFlash.init){
orginFlash.position = document.getElementById("flashcontent").style.position;
orginFlash.top = document.getElementById("flashcontent").style.top;
orginFlash.left = document.getElementById("flashcontent").style.left;
orginFlash.width = document.getElementById("flashcontent").style.width;
orginFlash.height = document.getElementById("flashcontent").style.height;
}
orginFlash.init = true;
orginFlash.isFullScreen = true;
var screenSize = getScreenSize();
try{
document.getElementById("flashcontent").style.position = "absolute";
document.getElementById("flashcontent").style.top = "0px";
document.getElementById("flashcontent").style.left = "0px";
document.getElementById("flashcontent").style.width = screenSize.width +"px";
document.getElementById("flashcontent").style.height = screenSize.height +"px";
document.body.style.overflow="hidden";
window.scrollTo(0,0);
}catch(e){
}
}
function normal(){
if(orginFlash.init){
orginFlash.isFullScreen = false;
try{
document.getElementById("flashcontent").style.position = orginFlash.position;
document.getElementById("flashcontent").style.top = orginFlash.top;
document.getElementById("flashcontent").style.left = orginFlash.left;
document.getElementById("flashcontent").style.width = orginFlash.width;
document.getElementById("flashcontent").style.height = orginFlash.height;
document.body.style.overflow="auto";
}catch(e){
}
}
}
function reSize(){
if(orginFlash.isFullScreen){
fullScreen();
}
}
window.onresize = reSize;
writeFlash();
</script>
P.S.
1、flash全屏功能代碼部分參考網上資料。
2、flash全屏功能在IE6以上,flash player 7.0以上 瀏覽器環境中測試可以運行!
3、flash全屏功能通過兩種方式實現,flash player版本號碼在9.0.18.60以上 是通過flash 9內部代碼實現的,而低於這個版本的則是通過js + div來實現的!
4、通過flash 9新功能來實現全屏技術要注意以下幾點:
a、flash player版本必須是 9.0.18.60或更高版本;
b、調用全屏功能代碼需通過觸發事件才可以啟動並執行,如onPress,onRelease事件;
c、在插入html 代碼時需設定<param name="allowFullScreen" value="true" />;
d、經多次研究發現,如 html代碼設定成<param name="wmode" value="opaque" />或<param name="wmode" value="transparent" />時,則全屏功能無效!也就是說只有flash視窗模組設定為window時,全屏功能才有效(這個算是我的獨家發現吧)!