0

変更したいメニューの HTML 構造は次のとおりです。

<nav>
  <ul id="fashionmenu">
    <li class=""><a href="#">Home<a/></li>
    <li class=""><a href="about.html">About<a/></li>
    <li class=""><a href="#">Services</a>
        <ul>
           <li><a href="#">Service 1</a></li>
           <li><a href="#">Service 2</a></li>
        </ul>
    </li>
    <li class=""><a href="#">Contact</a>
  </ul>
</nav>

私が達成しようとしたのは、ドロップダウンメニューの遅延でした.Jqueryコードはすでに持っていますが、何らかの理由で理解できません. hover にスムーズな効果がある場合、メニューに再度ホバーしない限り、メニューは引退しません。しかし、もちろん、マウスを別のメニュー項目に移動するたびに、ドロップダウンメニューが自動的に引退することを望みます。

これがJavaScriptです：

    $(関数(){
      $('#ファッションメニュー > リー > ウル')
        。隠れる（）
        .click(関数(e){
        e.stopPropagation();
      });


      $('#fashionmenu > li').toggle(関数(){
        $(これ)
        .removeClass('待機中')
        .find('ul').slideDown();
      }、 関数（）{
        $(これ)
        .removeClass('待機中')
        .find('ul').slideUp();
      });

    $('#fashionmenu > li').hover(function(){
      $(this).addClass('waiting');
        setTimeout(関数(){
          $('#fashionmenu .waiting')
          。クリック（）
          .removeClass('待機中');
          },300);
        }、 関数（）{
          $('#fashionmenu .waiting').removeClass('waiting');
        });

    });

ご回答ありがとうございます。

4

2 に答える 2

0

私があなたの問題を理解している限り...よく知られている hoverIntend プラグインで解決できるかもしれません: https://github.com/briancherne/jquery-hoverIntent

古いが同じ目的 - DoTimeOut http://benalman.com/code/projects/jquery-dotimeout/examples/hoverintent/

于 2013-04-02T18:33:39.227 に答える
0

このようなことをしてください：http://jsfiddle.net/mwwFn/1/

$(function () {
  $('#fashionmenu > li > ul').hide().click(function (e) {
    e.stopPropagation();
  });

  $('#fashionmenu > li').toggle(function () {
    $(this).removeClass('waiting').find('ul').slideDown();
  }, function () {
    $(this)
      .removeClass('waiting')
      .find('ul').slideUp();
  });

  $('#fashionmenu > li').hover(function () {
    $(this).addClass('waiting').find('ul').slideDown();

  }, function () {
    $(this).removeClass('waiting').find('ul').delay(3000).slideUp();
  });

});
于 2013-01-16T23:56:50.893 に答える