1

誰かが私がjQueryで抱えている奇妙な問題を理解するのを手伝ってくれることを願っています。フッターナビゲーションでファンシーホバーを実行しています。ホバーオフしてから、トランジションが終了していないサブナビゲーションに戻ると、ホバーが点滅します。これが私がコード的に得たものです。

jQuery：

   if($('#ft_navi .nav').length > 0){
    $('#ft_navi .nav ul').css('display', 'none'); /* if user doesn't have JS enabled, it will show everything for the customer */

    $("#ft_navi .nav > li").hover(function() {
        $(this).find('ul').stop(true, true).show('slow');
    }, 
    function(){
        $(this).find('ul').stop(true, true).hide('slow');
    }); //end of hover
} /* end of footer */

HTMLは次のとおりです。

    <ul class="nav">
          <li class="">
             <a href="">Automotive</a>
             <ul>
                <li class=""><a href="">Overview</a></li>
                <li class=""><a href="">Credit</a></li>
             </ul>
          </li>
    </ul>

したがって、詳細には、ホバー/オーバーオフは、誰かがマウスをすばやく操作するまで、問題なく機能します。上部のliにカーソルを合わせ、閉じる前にサブナビゲーションにカーソルを合わせると、サブナビゲーションが制御不能に点滅し、停止しません。停止機能がなく、次のようになります。

     $(this).find('ul').show('slow');

...すばやく開閉します。

ヒントをありがとう！

4

2 に答える 2

2

これを修正する1つの方法は、ホバーに遅延を追加することです。

http://jsbin.com/obenec/1/

if($('#ft_navi .nav').length > 0){
  $('#ft_navi .nav ul').css('display', 'none'); /* if user doesn't have JS enabled, it will show everything for the customer */

  $("#ft_navi .nav > li").hover(function() {
    $(this).find('ul').stop(true,true).delay(300).show('slow');
  }, 
  function(){
    $(this).find('ul').stop(true,true).delay(300).hide('slow');
  }); //end of hover
} /* end of footer */
于 2012-10-08T18:06:49.173 に答える
1

停止せずに（既にアニメーション化されている場合は要素のアニメーションを停止します）、要素にカーソルを合わせた回数を表示および非表示にします。jQueryの停止

于 2012-10-08T18:04:36.243 に答える