2014-07-25 2 views
0

나는 스크롤하는 동안 정상에 내 네비게이션 바 스틱을 얻을하는 방법에 대한 몇 가지 diffrent 자습서를하려고했는데하지만이 동작하지 않습니다 :/내 탐색 기능을 계속 유지하려면 어떻게해야합니까?

이 내가 가진 문제에 봉착 페이지입니다 : http://www.vernietig.be/vcs/index.html

미리 알려 주셔서 감사합니다.

+0

팁이 : 작은 뷰포트 (http://stackoverflow.com/q/6370690/453331) [미디어 쿼리]를 사용하여 (예를 들어, 모바일 장치) 특별한 규칙을 만들기 때문에, 메뉴가 끈적 거리지 않습니다. 웹 사이트의 절반이 메뉴 인 작은 전화 화면에서 무언가를 읽으려고 애쓰는 것은 큰 성가심입니다. – kba

답변

0

이 시도 :

#header { 
    position: fixed; 
    top: 0; 
    left: 0; 
    right: 0; 
} 
+0

Thanks Edward! 그게 전부 야! http://www.vernietig.be/vcs/index.html;) – mijncore

0

이 상단에 탐색을 버티 :

#yourTopNav{ 
    top : 0; 
    position : fixed; 
    } 
+0

은 2 가지 규칙을 추가하려고했지만 추가 할 때 : .nav-collapse, .nav-collapse * { -moz-box-sizing : border-box; -webkit-box-sizing : border-box; 상자 크기 : 테두리 상자; } 또는 .nav 붕괴, .nav-붕괴 UL { 목록 스타일 : 없음; 너비 : 100 %; float : left; } 나비가 사라졌습니다. .nav-collapse {}에 새 문자를 추가하려고 시도했을 때 아무 것도 변경되지 않습니다 .... – mijncore

0

당신의 CSS를이 추가 : clip: rect(0,0,0,0)가 있지만, 전체 메뉴를 숨 깁니다 왜

body { margin-top: 55px; } 
nav { position: fixed; clip: auto; } 

나도 몰라, 당신은 그 지시어를 인라인해야 할 수도 있고, 그 원인이되는 .nav-collapse 클래스를 제거 할 수도 있습니다. 그러나 실제로 메뉴가 어떻게 작동하는지 알지 못합니다 : P).

+0

은 머리에 2 개의 규칙을 추가하여 마지막으로로드되지만 작동하지 않습니다. ... – mijncore

+0

index.html LINE 28 거기에 내가 추가했습니다 ... – mijncore

+0

예를 들어, 당신이'nav'에'id'를 할당하고 두 번째 줄을'# # nav_id {위치 : 고정; 클립 : 자동; } '마지막 규칙이 적용됩니다. –