드롭 다운 메뉴가 호버시 닫힘 (오류)

메뉴 위로 마우스를 가져 가면 아무 문제가 없습니다. 나는 하위 메뉴 링크 및 어린이에 도착하려고 할 때 그러나, 메뉴드롭 다운 메뉴가 호버시 닫힘 (오류)

/*---------------------------------------------------- 
 
/* 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>

출처

2016-07-19 Suraz Bhandari

예기치 않은 동작을 일으킬 수있는 다른 이벤트 처리기 내에 이벤트를 바인딩하지 마십시오. 호버 기능이 목록 요소'li'에 직접 존재하고 다른 요소가 없으므로 – empiric

입니다. 당신도 HTML을 게시 할 수 있습니다 – Darren

나는 자바 스크립트에 더미, 나를 위해 rewritecode 수 있습니까? –

당신이 잘 작동을 게시 한 코드를 닫습니다; 그것을 증명할 plnkr이 있습니다 : https://plnkr.co/edit/IFaueUhKE3J1K9vY1NkQ?p=preview (단순히 상단 li에 <div id='navigation'><ul>을 감쌌습니다). 하위 요소 위로 마우스를 올려 놓으면 원래 질문에 표시되지 않는 것이 원인입니다. 예 : 이 CSS를 추가 :

li.menu-item { 
    position: relative; 
    top: 50px; 
    left: 300px; 
}

아이로 이동하는 동안 잠시, 부모 - 호버을 잃어 버려 어려운 하위 항목에 도달 할 수 있도록한다.

출처

2016-07-19 20:53:09

드롭 다운 메뉴가 호버시 닫힘 (오류)

답변

관련 문제