2013-06-21 2 views
0

이상한 HTML/JQuery 문제가 있습니다.스크롤 할 때까지 비활성 링크

내 홈페이지의 상단 탐색에는 HTML로 설명 된 5 개의 링크가 있습니다. 어떤 이유로 링크가 페이지를 스크롤 할 때까지 '활성화'되지 않습니다. 나는 스크롤에서 nav 요소를 단순히 '절대'에서 '고정'으로 변경하고 배경을 투명한 검정으로 변경하여 조작합니다. 그러나 링크에 링크가 있어서는 안됩니다.

Chrome을 사용하여 검사하면 각 메뉴 항목이 연결됩니다. www.barandbean.com - - 페이지는 여기

$(document).scroll(function(){ 

     if (!docked && $(document).scrollTop() > 36){ 
     docked = true; 
     $('#menu-nav').css('background','rgba(60,60,60,0.9)'); 
     $('#menu-nav').css('position', 'fixed'); 
     $('#menu-nav').css('top',0) 
     $('#menu-nav').css('height',49+'px') 
     } 
     else if (docked && $(document).scrollTop() < buffer) { 
     docked = false; 
     $('#menu-nav').css('background',''); 
     $('#menu-nav').css('position', 'absolute'); 
     $('#menu-nav').css('top',0) 
     } 
}) 

을 -

스크롤에 탐색을 조작하는 코드입니다 그리고 당신은 링크 탐색 변경 될 때까지 작동하지 않는 것을 알 수 있습니다 '고정'위치로 이동하고 창으로 스크롤합니다.

도움을 주시면 감사하겠습니다. 더 많은 코드 스 니펫을 추가 할 수 있지만 무엇이 가장 도움이 될지 잘 모르겠습니다.

+1

귀하의 # 시장-타이틀 pageprotoindex 메뉴의 상단에지고로 위치를 변경하기 때문에

scroll 후 작동하는 이유입니다. 나는 당신이 Z-index를 50으로 설정했다는 것을 알았지 만, Spokey와 같이 position : relative를 사용하지 않았다. 시도 해봐. –

답변

4

참고. 따라서 #menu-navposition:relative 또는 position:absolute을 추가하십시오. 당신은 절대

+0

아. 도와 주셔서 감사합니다. 그래서 z-index는 항상 DOM 'position'을 필요로합니다. 나는 메뉴 - 네비게이션이 Z- 인덱스를 활용할 수있는 '포지션'을 디폴트로 할 것이라고 생각했지만 분명히 그런 일은 일어나지 않았다. – jasdeepg

+1

@ jasdeep3 아니에요. 일부는 정정 할 수 있지만 위치가 정적 인 경우 일반적으로 z- 색인은 무시됩니다. 따라서 모두 지원하려면 위치를 설정하는 것이 좋습니다. – Spokey

0

z-index:1;을 메뉴에 설정해야합니다. z-index 요구 (기본값이다) 정적보다 다른 위치를 가지고 있음을

관련 문제