開発を行う際に、次のような状況に遭遇することがよくあります。 a.swf が Web ページに追加されます。a.swf ページと html ページの両方にスクロール バーがあります。プロジェクト マネージャーは、BT 要件を提案しました。マウスで a.swf をスクロールすると html ページはスクロールしませんが、それ以外の場合は html ページがスクロールします。 何をすべきでしょうか? 方法1 : 1. マウスが a.swf のスクロール領域に移動すると、ブラウザのマウス スクロール モニターを削除するように JS に指示します。 2. マウスが a.swf のスクロール領域から外れたとき: ブラウザのマウス スクロール リスナーを追加するように JS に指示します。 3.a.swf の wmode は「window」に設定されます。 要約: wmode を「window」に設定すると、プロジェクトの要件を満たさない可能性があり、a.swf がその下の HTML ページを覆います。さらに、マウスが a.swf のスクロール領域に移動し、Alt + Tab を押してページを切り替えると、JS にブラウザのマウス スクロール監視を追加するように通知されないため、操作後、HTML ページに戻るときにスクロール処理が行われません。 方法2 : 1. a.swf は、独自のマウス スクロール監視イベントをキャンセルし、wheelToFlash(value) など、JS が呼び出すスクロール処理インターフェイスを追加します。 2. マウスが a.swf のスクロール領域に移動したとき: JS に通知します (例: mouseIsInFlashWheelRange=true)。 3. マウスが a.swf のスクロール領域から外れたとき: JS に通知します (例: mouseIsInFlashWheelRange=false;)。 4.JSはマウススクロールイベントを監視します。イベント監視処理機能では、以下の判断を行う必要があります。 Javascript コード: コードをコピー コードは次のとおりです。マウスがフラッシュホイールの範囲内にある場合 { /**a.swf が提供するインターフェイスを呼び出して、a.swf でスクロールをシミュレートします*/ /**「flash」は HTML に埋め込まれた .swf の ID、値は HTML スクロール テーブルのスクロール値です */ document.getElementById("flashID").wheelToFlash(値); /** HTML ページ上のマウス イベントのバブルを防止します (通常は event.preventDefault())*/ イベントをデフォルトにしない(); } それ以外 { /** HTML の通常のスクロール処理を行います。何もする必要はありません*/ } 要約: 方法 1 と比較すると、wmode="window" の制限はありませんが、Alt + Tab の問題は依然として存在します。 注意:JS コードを書くときは、互換性の問題に注意する必要があります。ブラウザによってマウス イベントをリッスンし、スクロール値を取得する方法が異なります。 |
>>: Vue を通じて QR コードスキャン機能を実装する
Nginxを使用する目的Alibaba Cloud ECS クラウド サーバーを使用して、まずは著者...
目次グローバル変数 globalDataページプライベート変数データストレージ非同期ストレージ(デバ...
序文:データベースを日常的に使用すると、パスワードが単純すぎて変更する必要がある場合、パスワードの有...
Nginx グローバル変数Nginx には、$variable 名を通じて使用できるグローバル変数が...
この記事では、MySQL が条件に基づいてデータをクエリし、別のテーブルに更新する方法を例を使用して...
目次序文SSHとは何かssh は何に使用されますか? sshの使い方ssh 再修正要約する序文ssh...
イベントでは、SQL コードを 1 回または一定の間隔で実行することを指定できます。通常、複雑な S...
「ウェブサイトを高級感のあるものにするにはどうすればいいでしょうか? それともデザイン重視にすればい...
私はパフォーマンス テストを行うために常に Loadrunner を使用してきました。 Loadru...
以前、プロジェクトを開発しました。バックエンドのインターフェースを書くために Flask フレームワ...
実際、これは非常に簡単です。imgにaタグを追加し、 <a href='tencent...
目次単一マシンの展開オンラインプルミラーを見るRabbitMQを作成して実行するMQコンテナを正常に...
目次背景解決策1: 古いデータをバックアップするオプション2: テーブルを分割する解決策3: tid...
デプロイに docker-compose を使用すると、出力ログと関連イベントが検証されて出力される...
この記事では、参考までにMySQL 8.0.15のインストールと設定方法のグラフィックチュートリアル...