마우스 이벤트의 작업과 혼동

Question

여기에 내가 함께 ... CSS에서 CSS의 DIV에 을 다른 일을 잊지이 같다고 후 일부 CSS를 적용

<div id="_navigation"> 
      <ul> 
       <li>Destinations</li> 
       <li><a href="HtmlPage.html">Culture</a></li> 
       <li><a href="HtmlPage.html">Adventure</a></li> 
       <li><a href="HtmlPage.html">Hotels</a></li> 
       <li><a href="HtmlPage.html">Wild Life</a></li> 
       <li><a href="HtmlPage.html">History</a></li> 
       <li><a href="HtmlPage.html">About</a></li> 
      </ul> 
      <div id="_subNavigation"> 
       <div id="_navigationFirst"> 
        this is first subnavigation it must be showed when user clicks on Distinations 
       </div> 
       <div id="_navigationSecond"> 
        this is second subnavigation it must be showed when user clicks on Culture 
       </div> 
       <div id="_navigationThird"> 
        this is third subnavigation it must be showed when user clicks on Adventure 
       </div> 
      </div> 
     </div> 

HTML 코드 .onmouseleave id _subNavigation이 설정됩니다. display : none; 자바 스크립트를 사용할 때 누군가가 목적지를 클릭 한 다음 _navigationFirst (ID 임)로 표시되고 사용자가 탐색 영역 밖으로 마우스를 가져 가면 (보이지 않게 됨) 나타납니다. 사용자가 클릭 할 때 표시되도록 succeded되었습니다. 그것을하지만 사용자가 탐색 영역에서 마우스를 취한다 때 불이 꺼지고하지 않습니다 .. 여기에 내가 대상을 클릭 할 때 나는 그런 원하는 이미지를 얻을 내 javascipt

입니다

"use strict"; 
document.getElementById("_navigation").getElementsByTagName("ul")[0].getElementsByTagName("li")[0].onclick = function() { 
    console.log("got into block"); 
    document.getElementById("_navigationFirst").style.display = "block"; 
} 
document.getElementById("_navigation").onmouseleave = function() { 
    console.log("you left _navigation block"); 
    document.getElementById("_navigationFirst").style.display = "none"; 
} 

그래서 CodeGurus 내가 잘못? 및 효과를 얻기 위해 내가 어떻게

Answer 1

document.getElementById("_navigation").onmouseout = function() { 
    console.log("you left _navigation block"); 
    document.getElementById("_navigationFirst").style.display = "none"; 
} 

변경 그것에 "onmouseout"을 얻기 위해 노력하고있다. 나는 "onmouseout"이 당신이 원하는 효과인지 모르겠습니다. the difference between onmouseleave and onmouseout을 볼 수 있습니다. "onmouseleave"효과가 필요한 경우 javascript에 "onmouseleave"에 대한 지원 기능이 기본적으로 없기 때문에 jquery에 의존해야합니다. 작동 fiddle 여기에 있습니다.