0

ここにあるシンプルなJqueryドロップダウンメニューを使用していますhttp://wabism.com/jquery-drop-down-menu-tutorial/

ドロップダウン内のリンクにカーソルを合わせている間、メニューを強調表示したままにするリンクを取得する方法を知りたかっただけです。また、liクラス全体ではなく、トップレベルメニューのリンクのみがアニメーションをトリガーするようにします...

誰かがコードを修正してアニメーションの繰り返しを無効にするのを手伝ってくれました。だから私はデフォルトのプラグインコードをこれに置き換えました//

$('body').ready(function() {
$('.dropdown').hover(function() {
if ($(this).find('.sub_navigation').is(":visible")) {
$(this).find('.sub_navigation').slideUp();} else {
$(this).find('.sub_navigation').slideDown();}
});
});

ここにフィドルがあります// http://jsfiddle.net/tUYfw/90/

4

4 に答える 4

1

ドロップダウン内のリンクにカーソルを合わせている間、メニューを強調表示したままにするリンクを取得する方法を知りたかっただけです。

.dropdown:hover > a {
  background-color: #ccc;
}

.dropdownリストアイテムにはドロップダウンメニュー全体が含まれるため、カーソルがドロップダウンと相互作用している限り、リストアイテムは常にホバーされます。ただし、リストアイテム全体の背景を灰色にするのではなく、リンクだけにします。したがって、直接の子セレクターを使用して親リンクのスタイルを設定します。

また、トップレベルメニューのリンクのみがアニメーションをトリガーするようにし、liクラス全体をトリガーしないようにします...

親リストアイテム全体にカーソルを合わせると、ドロップダウンを開いたままにすることができるため、これはもう少し注意が必要です。

メニューをアクティブにするためにリンクだけが必要なのはなぜですか?あなたがあなたの推論を説明するならば、多分私達はより良い代替案を提案することができます。

于 2012-10-23T16:36:10.143 に答える
0
$('body').ready(function() {
    $('.dropdown a').bind('onmouseover',function() {
        $this = $(this).closest('.dropdown');
        $this.find('.sub_navigation').slideDown();
    });
});​

http://jsfiddle.net/mblase75/T6mhX/

http://api.jquery.com/closest

于 2012-10-23T16:14:49.800 に答える
0

セレクターを変更してアンカー タグを選択し、jQuery コードを変更して代わりに parentNode を使用することができます。

$('body').ready(function() {
    $('.dropdown a').hover(function() {
        if ($(this.parentNode).find('.sub_navigation').is(":visible")) {
            $(this.parentNode).find('.sub_navigation').slideUp();
        } else {
            $(this.parentNode).find('.sub_navigation').slideDown();
        }
    });
});​

更新された jsfiddle: http://jsfiddle.net/tUYfw/93/

于 2012-10-23T16:16:19.913 に答える
0

If all .dropdowns are equivalent, you can use first-child selector to do something with only the first one

$('.dropdown:first-child').hover(function() {...

http://api.jquery.com/first-child-selector/

于 2012-10-23T16:24:06.960 に答える