Onclick jqueryドロップダウンメニューがマウスアウトに表示されない

Question

jqueryのドロップダウンメニューがあります。マウスをクリックしてクリックするだけで、クリックするだけで変更することができます。jqueryを使用してiframeにsrc属性を追加します。ドロップダウンしている。

しかし、以前はホバー機能によって処理されていたタイムアウトとマウス出力のコーディングに問題があります。基本的には、開いているメニューをクリックしたときにカーソルをメニューに移動しようとすると、そのメニューが閉じられます。

<ul id="mylinksdd" class="mylinksdd"> 
     <li> 
      <SPAN style="font-weight:bold; cursor:default">Quick Links</SPAN> 
      <ul> 
      <li><iframe id="quicklinksframe" frameborder="0" class="autoHeight" width="250" src=""></iframe></li> 
      </ul> 
     </li> 
</ul> 

マイCSS：

/* mylinksdd */ 
.mylinksdd, .mylinksdd ul { 

    list-style: none; 
    margin: 0; 
    padding: 0; 
} 

.mylinksdd { 
    z-index: 100; 
    position: relative; 
} 
.mylinksdd li { 

    float: left; 
    margin: 0; 
    padding: 0; 
    position: relative; 
} 
.mylinksdd li a, .mylinksdd li a:link, .mylinksdd li a:active, .mylinksdd li a:visited { 
color: #1a508e; 
    display: block; 
    padding: 0 0px; 
} 

.mylinksdd ul { 
    background: #eee; 
    border: 1px solid black; 
    border-top: 6px solid #3c1e4c; 
    list-style: none; 
    margin: 0; 
    width: 75px; 
    position: absolute; 
    top: -999em; 
    left: -20px; 
    right: -20px; 
    padding: 5px; 
    color: #1a508e; 
} 
.mylinksdd li:hover ul, 
.mylinksdd li.sfHover ul { 
    top: 16px; 
} 
.mylinksdd ul li { 
color: #1a508e; 
    border: 0; 
    float: none; 
} 

すべてのヘルプは大歓迎です

 $(document).ready(function(){ 
    $("#mylinksdd li").hover(
      function(){ $("ul", this).fadeIn("fast"); } 
    ); 
    if (document.all) { 
     $("#mylinksdd li").hoverClass ("sfHover"); 
    } 
    });   
    $.fn.hoverClass = function(c) { 
     return this.each(function(){ 
     $(this).click( 
      function() { $(this).addClass(c); } 
     ); 
    $(this).mouseout(
    function() { $(this).removeClass(c); } 
    ); 
     }); 
    }; 

はここに私のHTMLです：

は、ここに私のコードです。私はこれが私に起こる持っていた おかげで、 デイブ

Answer 1

がうまくいけば、これはあまりにも混乱はありませんが、これはJSに行くためのマークアップなしで、私は実際に作業例を提供することができません...

。これは、ノード内の子ノードがmouseoutトリガーを持っているためにマウスアウトが発生するために起こります。変数を使用してsetTimeoutを保持して、hideメソッド（あなたの場合はremoveClass）の実行を遅らせます。また、マウスオーバーが実行されないようにするタイムアウト（存在する場合）をクリアする、マウスオーバーリスナーを子に追加します。子を終了するときに親を入力し、親を終了すると、隠しルーチンが正常に実行されるため、何も必要ありません。遅れは、マウス出力が発生するかどうかを確認するための時間を購入するだけです。

マークアップとcss（jsfiddle）を投稿できる場合は、プロトタイプを作成してください。