1

おかげさまで、ユーザーがマウスをリンクに移動するのに十分な長さのサブメニューが表示されるため、私のメニューが使用できるようになりました。残念ながら、それは正確ではありません。ユーザーのマウスがその上にある場合でも、サブメニューは閉じます。改訂された js ファイル コードとともに、以下の HTML コードを追加しました。問題は $('.myMenu > li').bind('mouseout', closeSubMenu); にあると考えています。ライン。おそらく別の方法として、openSubMenu 関数が呼び出された後にタイムアウト遅延を設けて、サブメニューが非表示になるまでに少なくとも 8 秒程度の時間をユーザーに与えることもできます。これは私にとって許容できる解決策です。

<!-- HTML menu code below -->
<ul class="myMenu">
<li class="menuHeader"><a href="#">Employees <img src="images/arrowdown.gif" alt="Employee Links" width="11" height="8" border="0"/></a>
<ul class="subMenu">
        <li><a href="#">Link1</a></li>
        <li><a href="#">Link2</a></li>
        <li><a href="#">Link3</a></li>
        <li><a href="#">Link4</a></li>     
    </ul></li>
</ul>       

<!-- js file code below -->
$(document).ready(function() {
    $('.myMenu > li').bind('mouseover', openSubMenu);
    $('.myMenu > li').bind('mouseout', closeSubMenu);

    function openSubMenu() {
        $(this).find('ul').css('visibility', 'visible');    
    };

    function closeSubMenu() {
        var ul = $(this).find('ul');
        setTimeout(function(){
        ul.css('visibility', 'hidden');}, 10000);

    };

});
4

3 に答える 3

1

コールバックは何もしませsetTimeoutんでした。コードをコールバック関数に入れる必要があります。 setTimeoutのようなものではありませんsleep

function closeSubMenu() {
    var ul = $(this).find('ul');
    setTimeout(function(){
        ul.css('visibility', 'hidden'); 
    }, 2000);
};
于 2012-08-27T02:36:54.817 に答える
0

setTimeoutコマンドは次のように機能しますsetTimeout(the function to execute, delay in milliseconds)

だから、これはあなたがする必要があることです:

setTimeout($(this).find('ul').css('visibility', 'hidden'),3000);

fromtoが実際のコマンドであることに注意してください$(this)'hidden')それでもうまくいかない場合は、代わりにこれを試してください。

    //これを<head>セクションに配置します
    関数closeDropDownFunction(){
    $(this).find('ul')。css('visibility'、'hidden');
    }

    //次に、タイムアウトが必要な場所にこれを配置します
    setTimeout(closeDropDownFunction()、3000);

于 2012-08-27T02:53:29.607 に答える
0

そのようなことを試してください。非表示に切り替えると、非表示になる前に 3 秒間遅延します。表示するトグルの場合、$('#toggle-item') はキューをクリアしてアイテムを表示します。

function toggle(show){

    if (show) {

        $('#toggle-item').stop().clearQueue().show();

    } else {

        $('#toggle-item').delay(3000);
    }
}
于 2012-08-27T02:42:12.663 に答える