0

ユーザーがドロップダウンのオプションにカーソルを合わせると、クリック可能なオプションがサブメニューに表示されます。

私が抱えている問題は、誰かがメニューオプション「comp 4」から選択したい場合、合計メニューがすぐに消えてしまい、オプションが孤立して選択できなくなることです。デモンストレーションのためにすべてのオプションを削除しましたが、ここで問題を確認できます。

http://jsfiddle.net/dt8kz/

23 行目 (jesfiddle) で遅延を適用する必要があると思います。

,function(){
         $('ul.fixture-list').delay(100).slideUp(50);        
});

これを試しましたが、期待どおりに動作しません。

ありがとう、

アラン。

4

1 に答える 1

0

私は以前、これらのトリックを行っていました。

遅延だけでは機能しません。達成する必要があるのは、1 つのタイマー変数と、それがホバーされているかどうかを示すステータスです。

少し汚い方法ですが、これが実際の例です。無効なhtmlを削除して、さらに関数を追加します。

http://jsfiddle.net/L48VL/1/

var hideTimer;
var Hovering = false;
    function HideFixture()
    {
        if(!Hovering)
        {
            $('#nav li.matches > ul').stop().slideUp(50);
            $('ul.fixture-list').slideUp(50);  
        }

    }
function ShowSub()
{
    clearTimeout(hideTimer); 
     $('.fixture-list').show();
}

次に、ホバーすると、次のようになります

$('#nav li').hover(
    function () {
        //show its submenu
         Hovering = true; 
        clearTimeout(hideTimer);
         $('#nav li.matches > ul.first').stop().slideDown(100);

    }, 
    function () {
        //hide its submenu
            Hovering = false; 
            hideTimer = setTimeout(HideFixture,300);   
        //$('ul.fixture-list').removeAttr('style');         

    }
);

それが役に立てば幸い ：）

于 2013-10-30T11:44:19.423 に答える