Hatena::Groupbluespear

bluespearの勉強メモ

2009-03-11

[][] swfobject.js利用時のFlash Playerブラウザ内最大化方法 15:11

Flash Player側で用意しているフルスクリーンだとキーボード入力がほとんど使えないので、疑似フルスクリーンとして使います。

の"1. How can I create a SWF that will encompass 100% of the browser window?"に書いてあります。

要約すると

  1. swfobject側ではwidth, height共に "100%"指定
  2. Flex側も100% (<mx:Application width="100%" height="100%">)
  3. html, body, container(swfobjectで置き換える要素)のスタイルを適切に設定

こんな風にすれば、Flash側からもブラウザ内最大化を切り替えられる。ExternalInterface.call("changeFullScreen");で呼んであげましょう。

  <style type="text/css" media="screen">
	html, body, #player_container	{ height:100%; }
	body						{ margin:0; padding:0; overflow:hidden; }
	#player_container { display: block; position: static; top: 0; left: 0; }
	
  </style>
  <script type="text/javascript" src="./swfobject.js"></script>
  <script type="text/javascript">
    swfobject.embedSWF("conpTest.swf", "player_container", "100%", "100%", "9.0.0");
  </script>
  <script type="text/javascript">
	var isFull = false;
	function changeFullScreen(){
	  var container = document.getElementById("player_container");
	  if(isFull){
	    container.style.position = "static";
	    isFull = false;
	  }else{
	    container.style.position = "absolute";
	    container.style.top = 0;
	    container.style.left = 0;
	    isFull = true;
	  }
	}
  </script>

とりあえず動いた、って感じなのでもっと効率の良いやり方がありそうです。ニコニコ動画もswfobject.js使っているようですし、最大化もこんな感じなんでしょうかね。

ゲスト



トラックバック - http://bluespear.g.hatena.ne.jp/bluespear/20090311