2

myNestContainerドキュメント準備完了でコントロール パネル ( ) を非表示にしています。というボタンがありnavMyNest、mouseenter発生すると が表示されますmyNestContainer。これはうまくいきます。

問題は、ユーザーがコントロール パネルを探索できるようにしたいということですが、ネストされた DIV コンテナーが にあるmyNestContainer場合、入力するとすぐにmouseleave有効になり、コントロール パネルが閉じます。

mouseenterこれは/よりもはるかにうまくmouseout機能していますが、私が望む機能はまだありません。

子オブジェクトをオーバーライドして、ユーザーが見ている間コントロール パネルを開いたままにする方法について何か考えはありますか?

前もって感謝します。

$(document).ready(function() {
$("div#myNestContainer").hide();
});

$("div#navMyNest").live("mouseenter", function(event) {
    $("div#myNestContainer").show();
});

$("div#myNestContainer").live("mouseleave", function(event) {
    $("div#myNestContainer").hide();
});
4

3 に答える 3

5

event.relatedTargetマウスがネストされた要素に移動した場合に、親要素を表示したままにするために 使用します。

$('#myNestContainer').mouseout(function(e)
{
    var evt = e || window.event;
    if (evt.relatedTarget != document.getElementById('navMyNest'))
    {
        $("#myNestContainer").hide();
    }
});
于 2011-12-07T17:07:36.510 に答える
0

この種のことを機能させるには、多くの醜いハックに頼らなければなりませんでした。また、ブラウザ固有のハッキングもありました。私の場合、ネストされた要素に iframe 要素がありました。

遅延/タイムアウトを使用し、マウスの (x,y) 位置を取得し、mousemove イベントに応答する必要がありました。

基本的に、マウスが境界領域の外に出るまで定期的にチェックし続け、要素を削除する必要があります。

フェードアウト効果を使用して要素を削除し、ラグ タイムをもう少し目立たないようにしました。

右上隅にある Facebook の「f」アイコンにカーソルを合わせて、実際の動作を確認してください: http://www2.highpoint.edu/

于 2011-12-07T17:05:39.733 に答える
0

問題を克服するためにjqueryホバー機能を使用できます...

http://api.jquery.com/hover/

基本的に、現在直面している問題を処理します。次のコードを使用します

 $("div#myNestContainer").hover( 

    function () {
     $("div#myNestContainer").show(); 
    },

    function () { 
    $("div#myNestContainer").hide(); 
    }
);
于 2011-12-07T17:03:38.377 に答える