1

了解しました。＃navdivの外側をクリックすると、以下のコードが正常に機能します。マウスを#navdivから離して、マウスを非表示にすることは可能かどうかを尋ねていました。divを非表示にするために「クリック」したくありません。例

 $(document).mouseup(function (e)
    {
        var container = $("#nav");

        if (container.has(e.target).length === 0)
        {
            container.hide();
        }
    });

mouseenterとmouseleavを試しましたが、機能しません。例 どんな助けでもありがたいです:)

4

3 に答える 3

4

これを試して：

$(document).ready(function(){
   $("#logo").mouseover(function() { $("#nav").fadeIn("slow"); });

   $("#nav").mouseleave(function (e){
       $(this).fadeOut("slow");
   });
});
于 2013-03-01T14:52:31.543 に答える
1

下のリンクを確認するために追加したナビにマウスボタンが必要です

$(document).ready(function(){
$("#logo").mouseenter(function() { $("#nav").fadeIn("slow"); });
});

$("#nav").mouseleave(function (e)
{
       $("#nav").fadeOut('fast');
});

http://jsfiddle.net/sKpwV/6/

ドロップダウン メニューを作成する場合は、次のリンクを参照することをお勧めします: http://csswizardry.com/2011/02/creating-a-pure-css-dropdown-menu/純粋な CSS でドロップダウンを実行します。であるため、ユーザーが Javascript を有効にしていない場合にも機能します。

于 2013-03-01T15:03:19.277 に答える
1

navdiv とdivの間のマージンがlogo問題を引き起こしています。ユーザーがそれらの領域の間にマウスを向け、 div にmouseout厳密にイベントを設定すると、ウィンドウが閉じます。nav解決策は、短いタイムアウトを追加して、メニューを閉じる前にユーザーがメニューをナビゲートできるようにすることです。これにより、ユーザーが誤ってナビゲーションの端にマウスを移動し、div.

この問題を解決するために使用したjQueryは次のとおりです。

$('#nav').mouseover(function () {
    clearTimeout($.data(this, 'mouseOutTimer'));
});
$('#nav').mouseout(function () {
    clearTimeout($.data(this, 'mouseOutTimer'));
    $.data(this, 'mouseOutTimer', setTimeout(function () {
        $("#nav").hide();
    }, 700));
});

http://jsfiddle.net/HyUEu/

于 2013-03-01T15:05:31.337 に答える