1

私の問題 (フィドル)

私の問題は、jquery のアニメーション化されたドロップダウン メニューで、[その他] リンクにカーソルを合わせると、サブ メニューが表示されないことです。Firefox を使用して「要素を検査」すると、高さがアニメーション化され、幅は問題ないように見えますが、表示されるのは左の境界線だけです。

その特定のセクションをブロックとして表示している場合、最初のメニューをアニメーション化すると表示されますが、順序付けられていないリストに入ると消えます(例)。これに何らかの関係があると思いますが、何が原因なのかわかりません。

私がおそらく見落としていることを扇動することは素晴らしいことであり、もちろん大歓迎です.

ノート：

  • Firefox、Chrome、Opera、および IE でこの問題が発生しました。
  • cssのみで動作するように設計されています。1 つ目.eachは、デフォルトの CSS ホバー動作をオーバーライドすることです。
  • 空のスパンには矢印イメージが保持されます。
  • 関連するコードのみが掲載されています。ただし、ここで私のサイトを表示できます
  • 何かをより効率的にするためのヒントがあれば、いつでも歓迎します。
4

2 に答える 2

2

http://jsfiddle.net/sailorob/4cdTV/5/

簡単にするために CSS を削除し、関数で管理していた多くの CSS プロパティを本質的に処理する jQuery の slideUp と slideDown を利用して関数を単純化しました。ここから、CSS の一部を元に戻すのはかなり簡単だと思います。

メニューで javascript/jQuery/animation を使用する場合は、mouseenter と「leaves」を起動するためにタイマー (setTimeout) を使用することを強くお勧めします。このようにすると、ユーザーが誤ってマウスをメニューの外に数ピクセル移動して閉じた場合でも、メニューはより寛容になります。

于 2012-08-23T19:19:36.157 に答える
0

JS と CSS のデバッグ中に、持っているすべての JSを削除すると、サブメニューを含むドロップダウン メニューが正常に機能することがわかりました。Other liは、その下のulをうまく開きます。ただし、JS がないとアニメーション化されないことに注意してください。

これがフォークされたフィドルです。

最新の Chrome と Firefox でテストしました。

于 2012-08-23T18:58:57.193 に答える