0

ウェブサイトにはシンプルな CSS ベース (JS なし) のドロップダウン メニューがあり、1 つを除いてあらゆる点で完璧に機能します。ランドスケープ モードの iPad で、メニューの下のリンク (パンくずリストなど) をクリックすると、リンクに触れるとフライアウトがトリガーされます。最初に触れたリンク。

<li>
    <a href="http://categorypage">
    <ul class="flyout">
        <li><a href="blah...

.header li:hover .flyout {
    display: block;
}

サイト (アダルト コンテンツに注意) はhttp://www.lovehoney.co.ukです。

これまでに成功せずに試したこと：

  1. コンテナーの z インデックスを変更します。
  2. もちろん、フライアウトに強制的に何も表示しないとフライアウトがブロックされますが、ナビゲーションがトリガーされているのを見ることができるので、フライアウトに問題があるとは思いません.
  3. pointer-events: 閉じたときのフライアウトではなし。

他の情報

  1. この問題は横向きモードの iPad 4 に影響しますが、iPad 1 には影響しません
  2. このバグは Chrome と Safari の両方に存在します
  3. ポートレートモードは問題なし。
  4. ナビゲーションの上をクリックしても問題は発生しません。
4

1 に答える 1

0

最後に、ビューポートのメタを次のように変更することでこれを修正しました

<meta name="viewport" content="initial-scale=1" />

これにより、応答性が少し低下しましたが、問題は解決しました。

于 2014-06-26T13:47:05.217 に答える