드롭 다운 메뉴가 사라지고 IE7 문제에서만 다시 발생합니다.

Question

드롭 다운 메뉴에 문제가 있습니다. 보통 그들은 잘 작동하지만, 다음과 같은 일이 일어난다. (우연히 IE7에서 일어난다. 우) :

나는 클래스 서브 메뉴가있는 li 위에 마우스를 올리면 id가 # nav2 fadesIn(); 이제 때 두 < 리 >의를 구분하는 "/"위로 마우스를 이동의

<li><a href="#">hover</a>/
    <ul id="nav2"> 
    <li><a href="#">hover2</a> /</li> 
    <li><a href="#">hover3</a></li> 
</ul> 

: 두 개의 리튬의 보조 탐색 (#의 nav2)의 사이에 그러나, 나는 다음과 같은이 menu fadesOut(); 그러나 마우스를 hover2 li 또는 hover3 li [메뉴가 완전히 사라지기 전에]에 놓으면 메뉴 (# nav2)가 [예상대로] 사라집니다.

이것은 javascript입니다. 사용 :

//show nav2 when mouse-over .submenu 
$('#nav1 li:eq(1)').addClass('submenu'); //adds class submenu to second list item 
$('#nav1 li.submenu').hover(function() { 
//mouse on 
$('#nav2').fadeIn(); 
}, function() { 
//mouse off 
$('#nav2').fadeOut(); 
}); 

EDIT1 :

/* NAV1 - top nav list top left corner */ 
ul#nav1 { position: absolute; left: 31px; top:48px; } 
ul#nav1 li { float: right; display: inline; margin-left: 5px;} 
ul#nav1 li a { color: black; font-size: 12px; font-weight: bold; } 
ul#nav1 li a:hover { color: #7090a7; } 
ul#nav1 li a.navActive { color: #7090a7; } 

/* NAV2 - bottom nav list (second list) top left corner */ 
ul#nav2 { display: none; position: absolute; left: -13px; top: 22px; height: 16px; background: url(../images/nav2bg.png) no-repeat top right; width: 171px; padding-right: 20px; line-height: 13px;} 
ul#nav2 li { float: right; display: inline; margin-left: 5px; } 
ul#nav2 li a { color: black; font-size: 12px; font-weight: bold; } 
ul#nav2 li a:hover { color: #f4f4f4; } 
.active { color: gray; } 

내가 또한 몇 가지 조건 IE7 문이 그것을 관한 :

이 두 NAVS, #의 NAV1 및 # nav2의 CSS는

... 나는 특정 IE7의 CSS 코드의 일부는 중복됩니다 실현,하지만 난 그것이 작동하지 않는 이유를 알 수없는 것

EDIT2 :이 IE8, 파이어 폭스에서 완벽하게 작동 언급해야 , Chrome 및 Safari.

IE7에서이 문제가 발생하는 이유는 무엇입니까?

고맙습니다.

마우스 왼쪽 다시 입력 것처럼 미트 마우스가 IE6/7에서 링크 경계를 교차

Answer 1

그러나이 문제를 어떻게 해결했는지 궁금하다면 jQuery를 사용하여 5px 여백을 제거하고  을 추가하십시오. 이것은 내가 사용 된 코드입니다 :

$('#nav1 ul li:last').css({ 'marginRight': '-5px' }).prepend(' '); // prevents IE 7 bug 

행운을 빕니다! Amit

Answer 2

, 그것은 마우스 (이 경우 동일한 상위 요소를 통해 여전히 경우에도 이벤트를 발생합니다 리). 한 가지 해결 방법은 마우스가 메뉴를 "빠져 나가지"않게하는 것입니다. < > 블록 사이에 틈이없는 메뉴를 사용하여 스타일을 조정할 수 있습니까?

li의 배경색을 빨간색으로 설정하고 a ...의 녹색을 표시합니다. 표시되는 빨간색은이 유형의 조작이있는 IE6/7의 잠재적 인 마우스 이벤트 위험 영역입니다.