2010年2月24日水曜日

【mixiアプリ】MouseEvent.MOUSE_WHEEL

最初はブラウザのスクロールを止め、Flash上でホイールイベントを処理したかったのが目的でしたが、
mixiにアップするとローカルでは取れていたのに何故か取れない状況に陥ったために色々と調べてみました。

検証にはIE6,FireFox3.5,GoogleChromeを使用しました。

元々まともにイベントが取れたのはIE6だけで、他の二つは取ることは出来ていませんでした。
更にブラウザのスクロールを止める処理を追加するとIE6でも取ることは出来なくなりました。

ブラウザのスクロールを止めるにはJavaScript側に以下のコードを追加します。

if(window.addEventListener){
window.addEventListener('DOMMouseScroll', wheel, false);
}
window.onmousewheel = document.onmousewheel = wheel;

function wheel(event){
if(!event){
event = window.event;
}
if(event.preventDefault){
event.preventDefault();
}
event.returnValue = false;
}


これでブラウザのスクロールが無効になります。

しかし、Flash側ではイベントが取れません。
何故イベントが取れないのか?正直まだわかっていません。

ローカルに置いてあるswfをブラウザにドラッグしていって起動したときは問題なく取れていました。
mixiにアップした時に取れなくなるのはmixiに原因があるのか?と、mixiアプリの仕様などを熟読

1箇所怪しい場所を発見
http://developer.mixi.co.jp/appli/pc/lets_enjoy_making_mixiapp/use_flash
>embedタグについて、wmode属性を指定します。wmode属性値として、”transparent”もしくは”opaque”を記述します。
>マウスホイールイベントをFlash上で拾うことができない

でも今回作ったやつにwmodeは指定していないのでこれではないのかも

このままではラチがあかないので強硬手段!
JavaScript側でスクロール値が取れるので、ActionScriptのExternalInterfaceの機能を使い、
JavaScript側からFlash側にスクロール値を送信する処理を作りました。

スクロール値を受け取ったFlashはその値を元にMouseEventを作成してdispatchEventをステージに流し、
擬似的にホイールイベントが発生するようにして対応しました!

その時JavaScriptのwheel関数に以下の処理を追加しました。

var delta;
if(event.wheelDelta){ /* IE/Opera */
delta = event.wheelDelta/120;
if(window.opera){ /* Opera9 */
delta = -delta;
}
}else if(event.detail){ /* Firefox */
delta = -event.detail/3;
}

一応これで動いているのでこのまま行ってみようかと思います。
もっと正しい方法があれば教えていただきたいです。

0 件のコメント: