0
드롭 다운 하위 메뉴가있는 Nav가 있습니다. 드롭 다운 내가 메뉴의 조합을하고자 나타나면 + 같이 드롭 다운 : 마우스 센터의 공용 jquery
여기 왜 단지 mouseenter 및 mouseleave 모두의 목표에서 서브 클래스를 제거하지 마십시오 MY FIDDLE
A
답변
0
입니까? this 같은
var animate;
$(".myClass").mouseenter(function() {
clearTimeout(animate);
$('.myClass').css('background-color','#777');
$('.mySubClass').css('display','inline');
});
$(".myClass").mouseleave(function() {
animate = setTimeout(function(){
$('.myClass .mySubClass').css('display','none');
$('.myClass').css('background-color','#49616a');
}, 800);
});
... .myClass 같은 커버 에리어 메뉴 드롭의 조합은 이미 (해당 요소는 링크 및 드롭 다운 메뉴를 모두 포함하기 때문에).
여기에 또 다른 잠재적 인 버그가 수정되었습니다 : mouseleave-mouseenter 이벤트를 너무 빠르게 시퀀스 할 수 있습니다. 그래야만 커서가 메뉴 영역에 남아 있기 때문에 시간 초과 기능이 실행되지 않습니다. 이를 방지하기 위해 추가 변수 (animate)가 추가되었습니다. 그것은 mouseleave 핸들러에 타임 아웃을 저장하고 그것을`mouseenter '핸들러에서 지 웁니다.
+0
나는'.myClass' 커버 영역이 이미 메뉴와 드롭의 결합이라는 것을 깨닫지 못했습니다. –
Erm ... 정확히 지금 작동하지 않는 것은 무엇입니까? 나를 위해, 그것은 마우스가 'item0'과 'item1'영역을 떠날 때 모두 작동합니다. – raina77ow
'item 0' 위에 마우스를 놓으면 드롭 다운이 나타나고 드롭 다운 위로 마우스를 이동하면'item 0'으로 다시 돌아갑니다. 드롭 다운이 사라지지 않아야합니다. –
첫 번째 문제는 mouseOut 이벤트를 추적하는 것입니다. 콘솔에 마우스를 올리면 item0 쪽이 to 요소가 목록 항목이 아닌 본문으로 등록된다는 것입니다. div 같은 실제 블록 요소를 사용하는 대신 목록 항목을 블록으로 만드는 문제가있을 수 있습니다. – invertedSpear