質問: 要素Aの上にカーソルが乗ったら要素Bを表示して、 要素Bの上にカーソルが乗ってる間も表示しておくよう、下記のようにしています。 ``` div.aaa { border: 1px solid #000; } div.bbb { display: none; border: 1px solid #000; } div.aaa:hover + div.bbb { display: block; } div.bbb:hover { display: block; } ``` ``` 要素A 要素B ``` ただ単にカーソルを乗せるだけなら、期待通りの動作するのですが、 Chromeで要素Bの上でクリックを繰り返すと消えてしまうことがあります。 他のブラウザ(Firefox,Opera,IE,Edge)でも試してみたのですが、このような現象は起きませんでした。 数回のクリックで消えることもあれば、数十回クリックしてもなかなか消えないこともあり、 どのタイミング、何をキッカケで起こるのか原因が分かりません。 これはChrome側の問題と考えるべきでしょうか? 何か情報お持ちの方おられましたら、ご教授いただけないでしょうか。 Chromeのバージョンは 57.0.2987.110 (64-bit) です。
回答: 状況を再現できなかったのでわかりませんが、デベロッパーツールでhoverを常にonにしながら連打してみてはどうでしょうか?裏の要素とかをクリックして閉じてるとかあるかも?