Question

每当我将鼠标悬停在菜单上时，它都能正常工作。但是，当我尝试进入子菜单链接和子项时，菜单关闭

/*----------------------------------------------------
/*  Dropdown menu
/* ------------------------------------------------- */
jQuery(document).ready(function($) {

  function mtsDropdownMenu() {
    var wWidth = $(window).width();
    if (wWidth > 865) {
      $('#navigation ul.sub-menu, #navigation ul.children').hide();
      var timer;
      var delay = 100;
      $('#navigation li').hover(
        function() {
          var $this = $(this);
          timer = setTimeout(function() {
            $this.children('ul.sub-menu, ul.children').slideDown('fast');
          }, delay);

        },
        function() {
          $(this).children('ul.sub-menu, ul.children').hide();
          clearTimeout(timer);
        }
      );
    } else {
      $('#navigation li').unbind('hover');
      $('#navigation li.active > ul.sub-menu, #navigation li.active > ul.children').show();
    }
  }

  mtsDropdownMenu();

  $(window).resize(function() {
    mtsDropdownMenu();
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<li id="menu-item-513" class="menu-item "><a href="#"><i class="fa fa-calculator"></i> OFFERTE AANVRAGEN</a> 
  <ul class="sub-menu">
    <li id="menu-item-1146" class="menu-item"><a href="#">Zonnepanelen installatie (België)</a>
    </li>
    <li id="menu-item-1144" class="menu-item"><a href="#">Zonnepanelen reinigen (België)</a>
    </li>
    <li id="menu-item-1145" class="menu-item"><a href="#">Zonnepanelen installatie (Nederland)</a>
    </li>
  </ul>
</li>

Answer 1

你发布的代码工作得很好;这是一个证明它的人：https://plnkr.co/edit/IFaueUhKE3J1K9vY1NkQ?p=preview （简单地将SKPaymentTransactionStatePurchased包裹在顶部li）。如果您仍然将鼠标悬停在子元素上，则会由您在原始问题中未显示的内容引起。例如。添加此css：

<div id='navigation'><ul>

会很难触及儿童物品，因为您在移居孩子时会短暂地失去父母悬停。

下拉菜单在悬停时关闭（错误）

1 个答案: