このフィドルは機能します(We Distribute
製品の下を参照):
http://jsfiddle.net/dgUFw/1362/
しかし、私が構築している Web サイトのコンテキスト内のページでは、JavaScript を実行しています (jQuery を含む)。たとえば、ホームページにスライドショーがあり、フィドル ナビゲーションの 3 番目のレベルにカーソルを合わせると、1 ~ 2 秒後に消えます。さらに、3 番目のレベルが 2 番目のレベルのリストの上に移動するなど、説明できない奇妙な動作が他にもありますがli
、これはフィドルでは発生しません。
私は CSS と JavaScript を一緒に統合することに比較的慣れていないので、この動作は見たことがありません。
Firefox で JavaScript をオフにすると、動作がおさまったように見えました。
何が原因で、どうすれば修正できますか? さまざまな JS ライブラリと CSS 正規化も試しましjsfiddle.net
たが、結果は同じでした。また、同じフィドルの結果と悪いウェブサイトの結果で Opera を試しました。Chrome はより堅牢で、誤動作を起こしにくいようです。
We Distribute
また、第 3 レベルの内部では、第 2 レベルのテキストが黒くなっていることに気付いたかもしれません。これを白のままにするのも難しいです。しかし、これは私の主な質問ではありません。JavaScript/CSS の相互作用に最も興味があります。
メモを編集
以下からいくつかのアドバイスを受けて、これをさらにテストしました。
フィドルでさらにテストを行いまし た。これは、クリックせずに折りたたみが発生することを除いて、Web サイトで見られる動作と実際には似ています。メニューをクリックして折りたたんだ後、ホバーしても通常に戻りません。