web-dev-qa-db-ja.com

ブラウザでWebサイトのナビゲーションホバーポップアップを停止する方法

迷惑なタイプのポップアップに遭遇し、それを抑制する方法がわかりません。問題は、Webサイトのナビゲーションに関連する特定のサイトのリンクにカーソルを合わせるとアクティブになることです。これはすべてのブラウザで発生します。以前はこの動作を思い出していませんが、突然、複数のブラウザと複数のサイトでこの動作に遭遇しました。

Amazon.comとwalmart.comのサイトは、私がこれに遭遇している少なくとも2つのサイトです。どちらの場合も、商品ページの上部近くに、ショッピングの「ヘルパー」リンク(下の写真で丸で囲んだ部分)の列があります。これらはサイトナビゲーションメニューです。これらのリンクのいずれかをクリックすると、専用のページに移動します。

しかし、ホバーの「機能」があります。これらのリンクのほとんどにマウスを合わせると、「クリックオン」ページの短縮版であるリンクのメニューを含むウィンドウがポップアップ表示されます。そのウィンドウは画面の大部分をカバーし、マウスがポップアップウィンドウのいずれかの部分にある限り表示されたままになります。他にも同様の「ホバーブービートラップ」がページ全体に散らばっています。

問題

問題は、ホバー遅延がないため、これらのリンクの1つを通過するだけでホバーとして扱われることです。この地雷原の何かを誤って渡すと、巨大なナビゲーションメニュー(または他のコンテンツ)でページが突然見えなくなり、マウスカーソルがそのウィンドウの外に移動するまでページがブロックされ続けます。さらに悪いことに、ポップアップウィンドウのゴミに関連する新しいページが表示されることがあります。

私のメインブラウザはFirefox(V62)ですが、Windows 7とLinuxの両方で、ChromiumとVivaldi、およびWindowsのInternetExplorerで複製しました。 Daniel Bは、Edgeでもそれを複製したとコメントしました。 (以前は、Microsoftブラウザーの動作が異なるように見えましたが、そうではないことが判明しました。)

質問:

  • 採用されているポップアップメカニズムは、以下に示すリンク例のWebページのソースコードから簡単に判別できますか?
  • FirefoxまたはChromiumベースのブラウザでこのアクションを抑制する方法はありますか?

更新

@Kinnectusは、Javascriptが「ポップアップ」コンテンツの表示/非表示に使用される可能性が高いとコメントしました。それらのページでJavascriptを無効にしましたが、それがメカニズムです。残念ながら、Javascriptを無効にすると、ページ上の他の重要な機能も無効になります。そのため、メカニズムは確認されていますが、どのソリューションもJavascriptを無効にするよりも外科的である必要があります。



再現方法

問題の再現は思ったほど簡単ではないことを発見しました。 Webサイトは、サイトにログインしているかどうか、さらには製品ページへの移動に使用されたルート(症状の再現における以前の混乱の原因である可能性が高い)に基づいて、サイトでの以前の履歴に基づいてコンテンツを調整しているように見えます。

例として各サイトに特定のリンクを提供しますが、バリエーションによって一部の読者の回答能力が制限される場合があります。たとえば、妻のコンピューターで以下の直接リンクをテストし、サイトが妻を「記憶」していることに気付く前にさまざまなページ機能を取得し、自動的にログインしました。妻をログアウトすると画面が変わりました。

これが 製品ページ atwalmart.comで、ショッピングヘルパーの行が丸で囲まれています。

enter image description here

丸で囲まれたリンクの1つにカーソルを合わせるか、その上を通過します。

enter image description here

これが 製品ページ atAmazon.comで、ショッピングヘルパーの行が丸で囲まれています。

enter image description here

丸で囲まれたリンクの1つにカーソルを合わせるか、その上を通過します。

enter image description here

Amazonのすべての商品ページで、ルートに関係なく、右上のAccount & Listsリンクにホバーアクションが表示されますが、同じメカニズムであるかどうかはわかりません。



調査

これを調べて、ナビゲーションメニューに関するこの問題についてのオンラインディスカッションは見つかりませんでした(しかし、それはごく最近のようです。これは、古いブックマークまたは履歴リンクを介して製品ページにアクセスすることが多いという事実によっても示される可能性があります。 tは症状を示しますが、新しい検索で同じページにアクセスすることはあります)。ただし、次のような解決策を使用して、他の種類のポップアップに関連する議論があります。

  • MouseHoverTimeのようなマウスの特性を変更します。ただし、ツールチップなどの正当なホバーオプションのパフォーマンスを低下させたくありません。それが実際の解決策であるとしても、MouseHoverTimeはWindowsレジストリ設定であり、Linuxでの同等の設定を私は知りません。
  • ポップアップをブロックします。これらはサイトナビゲーションの一部であり、ブロッカーが焦点を当てているようなものではありません。最高評価のポップアップと広告ブロッカーをインストールしていますが、影響はありません。

    オーバーレイをブロックすることもできるPoperBlockerをインストールしました。これらはそれ自体では検出されず、コンテキストメニューへの移動はウィンドウからの移動として扱われたため、ウィンドウが存在するときにPoperBlockerにチェックを依頼する方法はありませんでした。これはオーバーレイを完全に除外するものではありませんが、Poper Blockerは、オーバーレイをブロックすることを私が知っている唯一のアドオンであるため、いずれにしても、これは解決策にはなりません。

  • 特定のURLをブロックします。これらのポップアップはURLではありません。
  • この質問 MozillaサポートフォーラムはURLポップアップに関するものですが、受け入れられた回答では、userChrome.cssを変更することで修正できるFirefoxV61のいくつかの変更について説明しています。それが関連しているかどうかはわかりません。ChromiumベースのブラウザとMicrosoftブラウザでの同様の問題については説明できません。私もプログラマーではないので、それが解決策だとしても、役に立たなかった。
  • パスオーバーによるトリガーは、アドオンによるブラウザの誤動作ではないことを確認しました。
1
fixer1234

あなたが説明しているのは、ウェブサイトのナビゲーション/デザインの自然なデザインであり、ブラウザはマウスが要求しているものに従うだけです-要素の表示を起動するように設計された要素の上にマウスを置くと、ナビゲーションメニューが表示されますマウスがトリガー要素を離れると、コンテンツが消えます(または非表示になります)。

ユーザーがこのアクションを意図していなかったときはいつでも、コンテンツをフラッシュオープン/クローズする-例:サイトをナビゲートしたくないという理由で、単に画面上でマウスを動かすと、解決策が促されました。私が覚えている限りでは、それはhoverIntent(デモ: https://briancherne.github.io/jquery-hoverIntent/ )と呼ばれています。開発者が要素をターゲットにできるソースコードに含めることができるjQueryプラグイン。ターゲット要素に定義された最小時間ホバーすると、開発者が望むホバー効果を起動します。たとえば、ナビゲーションメニューを表示します。

問題のデモンストレーションは、特に元のhoverIntentプラグインを使用していませんが、ここでデモンストレーションできます(ソース: http://www.csslab.cl/2015/05/07/hover-intent-moderno-en- menues-dropdown /

問題

enter image description here

結果

enter image description here

修正

残念ながら、Webサイトの機能は完全に開発者に委ねられているため、ブラウザプラグインを使用せずに、意図した機能を上書きすることは非常に困難です。個々のサイトのJavaScriptとCSSを選択的にオーバーライドする機能を提供しているように見えるそのようなプラグインの1つは、少なくともChromeのKylePaulsenのResource Overrideです( https:/ /chrome.google.com/webstore/detail/resource-override/pkoacgokdfckfpndoffpifphamojphii?hl=en )。

カイルポールセンは、すべての可能な機能を紹介するYouTubeチュートリアルを提供しています-非常に有望なソリューションに見え、かなり簡単に理解できるように見えます: https://www.youtube.com/watch?v=62QIWAP9mMM

1
Kinnectus