1. ホーム
  2. Web制作
  3. HTML/Xhtml

htmlと埋め込みFlashの両方にスクロールバーがある場合の解析と対処法

2022-01-16 19:44:24
開発業務では、このような状況によく遭遇します。
A.swfがウェブページに追加され、a.swfとhtmlページの両方にスクロールバーがある。プロジェクトマネージャーはBTから、a.swfのマウスがスクロールしたときにhtmlページがスクロールしないように処理すること、またはその逆を行うことを要求されています!
どうすればいいのでしょうか?
方法1 :
1. a.swfのスクロールエリアにマウスを移動させたとき。ブラウザのマウススクロールリスナーを削除するようにJSに伝える。
2. a.swfのスクロールエリアにマウスを乗せる。ブラウザのマウススクロールリスナーを追加するようにJSに伝える。
3.a.swfのwmodeを"window"に設定します。
要約すると:wmodeは&quotに設定;ウィンドウ"は、その下に任意のhtmlページをブロックするa.swfになり、プロジェクトの要件を満たしていない可能性があります。さらに、マウスはブラウザマスクリスナーを追加するJSに言わずにページを切り替えるにはAltキーを押した後にa.swfスクロールエリアに移動し、操作はhtmlページに切り戻した後にスクロールが扱われないようになります
方法2 :
1.a.swfは、独自のマウススクロールリスナーを削除し、wheelToFlash(value)などのJSが呼び出すスクロール処理のインターフェースを追加しました。
2. 2. マウスがa.swfのスクロール領域に移動したとき:JSに伝える(例:mouseIsInFlashWheelRange=true)。
3. マウスがa.swfのスクロールエリアから外れたとき。mouseIsInFlashWheelRange=falseなど、JSに伝える。
4. JSはマウスのスクロールイベントをリッスンしますが、イベントリスナーハンドラの中で、以下の判定を行う必要があります。
Javascriptのコードです。
コピーコード
コードは以下の通りです。

if(mouseIsInFlashWheelRange==true)
{
/* Call the interface provided by a.swf to make a.swf simulate scrolling */
/*"flash" is the ID of the html embedded a.swf, value is the value of the html scrolling table scroll*/
document.getElementById("flashID").wheelToFlash(value);
/* Prevent bubbling of mouse events on html pages, usually event.preventDefault()*/
event.preventDefault();
}
else
{
/* Handle the normal scrolling of the html, we can do nothing */
}

概要 : 方法1と比較して、wmode="window"の制限はありませんが、Alt+Tabの問題は依然として存在します。
備考 : ブラウザによってマウスイベントを聞き、スクロールの値を取得する方法が異なるため、JSコードを書く際には互換性の問題に注意する必要があります