レイヤーを利用して画面を覆う (2)

むらけん兄さん :hakase: の overLayFlash.js を試すよ! :boy:
ウィンドウ全体を SWF で覆うのだ。

音が鳴るので、注意されたし。 :music:

:caution: 要 Flash Player 8 以上

frog_click

:caution: 反応しなくなったら、リロードしてください。

参考資料「F-site | レイヤーを使用したFull Flash

html
<script type="text/javascript" src="overLayFlash.js"></script>

<a href="overLayFlash.swf" rel="externalOverLayFlash" ver="8,0,24,0">click</a>
overLayFlash.js
function showFlash(objLink) {
    (中略)
  var myTag= ‘<object …(中略)… width="100%" height="100%" id="externalOverLayFlash" …(中略)…><embed …(中略)… width="100%" height="100%" name="externalOverLayFlash" id="externalOverLayFlash" …(中略)… /></object>’;
    (中略)
  window.document.externalOverLayFlash.onclick = function () { hideFlash(); return false; };
    (中略)
}

function initoverLayFlash() {
    (中略)
    if (anchor.getAttribute("href") && (anchor.getAttribute("rel") == "externalOverLayFlash")) {
    (中略)
}
function hideFlash() {
  var objBody = document.body;
  //objBody.removeChild(objBody.firstChild);
  objBody.removeChild(document.getElementById("overlay"));
}

window.onscroll = function() {
  //window.document.externalOverLayFlash.SetVariable("yScroll", getPageScroll()[1]);
  var yScroll = getPageScroll()[1];
  swfTarget("externalOverLayFlash").setScroll(yScroll);
}
function swfTarget(str) {
  if (navigator.appName.indexOf("Microsoft") != -1) {
    return window[str];
  } else {
    return document[str];
  }
}
_root に、ムービークリップ(インスタンス名: ground, frog) を配置。
# ground の基準点は左上。

_root 第1フレームに
import flash.external.ExternalInterface;

Stage.scaleMode = "noScale";
Stage.align = "TL";


ground._alpha = 0;
frog._visible = false;

var pageScroll:Object;
var yScroll:Number;
var pageSize:Object;
//var pageHeight:Number;
var windowHeight:Number;
var gHeight:Number = 50;
var fHeight:Number = 20;
var fWidth:Number = 60;

var resizeListener:Object = new Object();
resizeListener.onResize = function():Void {

  updatePos();
}
Stage.addListener(resizeListener);


updatePos();
function updatePos():Void {

  pageScroll = ExternalInterface.call("getPageScroll");
  yScroll = pageScroll[1];
  pageSize = ExternalInterface.call("getPageSize");
  //pageHeight = pageSize[1];
  windowHeight = pageSize[3];
  ground._width = Stage.width;
  fixScroll(yScroll);
}
function fixScroll(yScroll:Number):Void {
  ground._y = windowHeight – gHeight + yScroll;
  frog._y = windowHeight – fHeight + yScroll;
}
ExternalInterface.addCallback("setScroll", null, fixScroll);

this.onEnterFrame = function():Void {
  ground._alpha += 5;
  if (ground._alpha >= 50) {
    ground._alpha = 50;
    frog._visible = true;
    delete this.onEnterFrame;
  }
};

onMouseDown = function():Void {
  getURL("javascript:void(hideFlash());");
};
と記述。

[labo] overLayFlash (2) では、
onMouseDown = function():Void {
  //getURL("javascript:void(hideFlash());");
  ExternalInterface.call("hideFlash");
};
と記述。

MacOSX 10.3.9 + Safari 1.3.2 / Firefox 1.5.0.4 の環境では、正常に機能しているよ! :doki:
うちのマシンでは、wmode=”transparent” は、ちと重い。 :bouzu:


[修正] (07/03/09 Fri 12:14)
Internet Explorer では、インスタンスがないと背景がクリックできてしまう。この対応策のため、スクリプトを追加・修正。

[修正] (07/03/24 Sat 17:28)
overLayFlash.js に変更を加えた。

かえる君をクリックして、swf を表示。画面をクリックして、swf を非表示。MacOSX 10.3.9 + Safari 1.3.2 では、2回目の画面クリックで、トップの swf も消えてしまうの。 😥 解消された模様。

Windows Firefox 2.0 で、2回目の画面クリックで強制終了される現象はこの修正でどうなるのかは不明。 :caution: