2011-10-17 3 views
0

jquery 및 div 메뉴가 제대로 숨겨져 있지 않은 경우 약간의 문제가 있습니다!스크롤 할 때 다른 요소가 겹칠 때 메뉴 숨기기 (div)

사용자가 아래로 스크롤하는 동안 창 뒤의 뷰포트 상단에 고정 메뉴가있는 한 페이지짜리 사이트가 있습니다. 모든 네비게이션은 세로 스크롤 (div 높이에 따라 다름)과 비슷합니다.

모든 페이지 내용은 다음과 같이 별도의 div에 있습니다.

<!-- this is the menu--> 
<ul id="jmenu" style="position:fixed; z-index:9999"> 
    <li>...</li> 
    <li>...</li> 
</ul> 
<!-- this is the structure section--> 
<div id="first">...</div> 
<div id="second">...</div> 
<div id="third">...</div> 
<div id="fourth">...</div> 

등등.

는 나는 (이 경우 일부 H1 태그) 텍스트

중복 인 경우 메뉴를 숨기려면이 jQuery 코드 및 라이브러리 JQuery와 오버랩을 (https://github.com/brandonaaron/jquery-overlaps)를 사용
var over= false; 
$(document).scroll((function() { 
if($('#jmenu').overlaps("h1") && (over==false)){ 
    $('#jmenu').fadeOut("slow"); 
    over= true; 
}else{ 
    $('#jmenu').fadeIn("slow"); 
    over= false; 
} 
})); 

하지만이 점에 대해서는 문제가 있습니다. 모든 페이지를 빠르게 스크롤하고 메뉴가 여러 다른 h1과 겹치면 메뉴가 깜박이기 시작합니다.

누군가 내가 잘못하고있는 것을 말해 줄 수 있습니까 ???

답변

0

이 줄을 입력하십시오.

if($('#jmenu').overlaps("h1") && (over=true)){ 

당신은 여기에 오타가

if($('#jmenu').overlaps("h1") && (over=false)){ 
+0

아니요 ... 불경기는 동일합니다. 깜박임 계속 : ( – MrSlash

0

수 :

그것은 페이딩이 발생되지 않도록 할 수 있습니다 && (over=true)&& (over==true)하거나 && (over)

+0

고마워! 이제 괜찮아. – MrSlash

0

그냥 생각해야한다 스크롤 속도가 빠르기 때문에 혼란스러워집니다. 미리 작성된 페이드 기능 대신 .stop (true, true) .animate (/ 여기에 속성 /)를 사용해 볼 수 있습니다. jquery에서 .stop()을 찾으십시오, 여기 열쇠입니다.

좀 더 명확한 답변을 결정하려면 실제 페이지를보아야합니다.

+0

시도했지만 효과가 동일합니다 .Jquery 줄을 script.js 시작 부분에 확인할 수 있습니다. 링크는 http://bit.ly/qicIa2입니다. – MrSlash

관련 문제