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时,全屏功能才有效(这个算是我的独家发现吧)!
Trackback:
TrackBack URL for this entry:
http://www.klstudio.com/cmd.asp?act=tb&id=104
Comments:
你说得这个解决方法我曾经考虑,但是试过后,发现如果flash的窗口模式设置成"window"的话,那flash就是永远高于div的层数的,也就是说flash总是在div上面的
3Q!
不过代码挺多的。
这个全屏代码是随着显示器的分辨率而定的吗?
我收藏在我网站咯 http://www.9941.cn
没错,flash的窗口模式设置成"window"的话,flash是高于div的层数的.
不过我看到有个网站(yoqoo.com)上的登陆功能可以实现,大致看了下源码,初步分析应该是用JS来把div放到flash内容层级之上,有空亲自试一下。
一点全屏。。。firefox2.0 crash了...
嘿嘿 老鹰 这个脚本在IE、OPARE里都可以用,在FF里需要点击两次,不过在ns里竟然什么都看不到,包括swf都没现实。不过偶确实葱白你,我正在倒弄一个自动适应屏幕并且外部设置变量的方法,可是竟然不成功。
FLASH全屏, 要的就是这个效果啊. 厉害啊.
学习啊
是否可以考虑AS与JS通讯来实现DIV层更替
楼上的,请问一下.DIV有没有属性什么的来来浮出浏览器及任务栏啊?
非常不错的效果啊!支持
现在一般用js来屏蔽鼠标右键或者键盘功能
但是当有交互的flash时,网页焦点在flash上
则原有的js功能失效,比如F5按了之后就重新载入了
不知道您有什么好地解决方法呢?
有个细节问题,
全屏按ESC退出时,你怎么把那个按钮设回"全屏效果"?
现在显示是不正确的吧(按ESC退出后还显示着"退出全屏")
你能做到在按ESC的时候自定义事件吗?
好像无效的
哭啊 ie7下面 over了
这个的效果我看了,player9以上是全屏,9以下的全屏还是在IE里面的,没充满整个屏幕,要实现象9一样的效果还要做哪些补充呢?
低于player 9的话,无法做到直正的全屏,只能达到那个效果了!
恩,9的全屏状态下,按ESC的时候自定义事件好象就无效了,不知道是不是9的bug...
可以全屏使用,不过有一个问题,原来的输入交互不能使用了啊,点不到文字框里面,怎么处理啊?~~~~~~~
想请教一下 按了ESC键我想加个事件 可是无效....这个问题可以解决吗?
Stage.addListener( EventListener );
Stage.addListener( xxxx );
EventListener.onFullScreen = function( bFull:Boolean ) {
if ( bFull) {
fun_visib(true);//事件
xxx._x=100;//测试用
} else{
fun_visib(flase);
xxx._x=50;
}
}
这个方法 说是2.0下可以监听 可是测试的时候却没任何效果 就没有执行 不知道为什么?
呵呵 问题以解决!
有好心的朋友帮忙翻译了说明,大家在用到 Stage["displayState"] = "fullScreen";
时 需要更新自己的类库,这样就可以监听了。
这个效果非常棒! 但是全屏后在Flash中的TextInput 组件无法使用,请问有没有方法解决?? 谢谢
博客内容的很不错!以后我会常常来看看!
非常棒的全屏,我收藏使用啦
那有没有什么办法,可是让 网页打开就是全屏,而不是需要点一下.
默认 是全屏???
因为flash player功能限制,默认状态下是不能全屏的
yoqoo.com 现在是http://www.youku.com/,它首页的flash也加了wmode=transparent参数。上面大侠说的用登录窗口,用js弹出div时,页面把flash隐藏了,所以没有遮挡问题。
这个效果在我打了MS最新补丁之后就失去作用了......FIREFOX还直接报错.................
function getPlayerVersion():Number {
var version:String = System.capabilities.version;
if (version) {
version = getVersion();
}
var vers:Array = version.split(" ");
vers = vers[1].split(",");
return Number(vers[0])+Number(vers[1])/100+Number(vers[2])/10000+Number(vers[3])/1000000;
}
这段代码,是错的吧
if (!version) {
version = getVersion();
}
对了,建议楼主,在此文处,写上“此代码工作在AS2环境下”,因为AS3,你的代码能不过,如果
if (version) {
version = getVersion();
}中的getVersion();方法,它在AS3中不能通过…………
费我了好多事,建议用SWFOBJECT与AS3配合完成版本测试……
在FIREFOX和SAIFAR里不灵啊
正在做一个FLV的播放器,一般流行的FLV播放器都是双机就自动全屏,但是博主的那个代码,必须得点击那个全屏按钮把。
怎么修改成双机就全屏的呢?
请教怎样把"按ESC键退出全屏模式"改成别的文字?
这个是无法去除了,因为这是flash player自带的,无法更换。
当按全屏按钮时,能否跳转到第二个FLASH而全屏呢?或者是默认就全屏?
Post a comment:(为了防止垃圾留言信息,您的留言需要通过审核才能显示出来)
◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

wmode为opaque或transparent时全屏无效的我也碰到过,当时是因为有个需要浮动在顶层的div被这个需要全屏显示功能的flash挡住了一部分,而div不被flash挡住的解决办法就是wmode设为opaque或transparent,结果矛盾就出来了,要么被挡,要么不能全屏,当时就没管它了,后来想想,如果用JS把div放到顶层显示应该就可以解决这个矛盾了,Kinglong你觉得呢?