트위터 부트 스트랩을 사용하여 끈적 끈적한 navbar 만들기?

더 이상 볼 수 없을 때 고정 머리글 위치 지정을 채택하는 navbar를 소개하려고합니다. 이 스레드를 사용하여 시작 : Replicating Bootstraps main nav and subnav.트위터 부트 스트랩을 사용하여 끈적 끈적한 navbar 만들기?

그 이후로, 나는 도착했습니다 : http://jsfiddle.net/yTqSc/2/.

문제 :

앵커 링크 메뉴 바는 원래 위치에있을 때마다 (내부 목적지 호 숨어) 타겟을 오버 슈트되지만, 그것이 고정되지 일단. 나는 overshoot (나는 http://nicolasgallagher.com/jump-links-and-viewport-positioning/demo/을 언급했다)를 고칠 수있다. 그러나 그 다음 나는 navbar가 고쳐질 때 링크를 사용하는 과도한 간격으로 끝난다.

탐색 표시 줄이 고정되어 있는지 여부에 관계없이 일관된 결과를 얻는 방법에 대해 조언 해 줄 수 있습니까?

감사합니다.

출처

2012-08-24 espanapin

무엇을 찾고 계십니까?

<div class="navbar navbar-fixed-top">

출처

2012-08-24 18:06:42 guleryuz

나는 이것이 어떻게 질문에 대답하는지 잘 모르겠습니다. 나는 이미 자바 스크립트를 사용하여이 클래스를 동적으로 추가하고 있으며 문제의 근원 인 것으로 보인다. 일관성없는 동작은 앵커 링크로 이동 한 후이 클래스를 추가 한 결과 발생합니다. – espanapin

너는 navbar-fixed-top 용 CSS가 없습니다. 또한 위로 스크롤 할 때 처리해야합니다.

참조 데모 http://jsfiddle.net/yTqSc/39/

자바 스크립트

$(document).scroll(function(){ 
var elem = $('.subnav'); 
if (!elem.attr('data-top')) { 
    if (elem.hasClass('navbar-fixed-top')) 
     return; 
    var offset = elem.offset() 
    elem.attr('data-top', offset.top); 
} 
if (elem.attr('data-top') <= $(this).scrollTop()) 
    elem.addClass('navbar-fixed-top'); 
else 
    elem.removeClass('navbar-fixed-top'); 
});

.subnav { 
    background:#FFF; 
} 
.navbar-fixed-top { 
    position:fixed; 
}

또는 끈적 요소를 처리하는 웨이 포인트의 jQuery 플러그인을 사용하여 CSS

출처

2013-04-05 22:47:25 steve

그것은 좋은,하지만 나는이 같은 대신 맨 하단에 스티커 탐색을 구현하는 미친 가지고 : http://golkhaneh.tv3.ir/

어떻게 할 수 있습니까?

출처

2013-10-29 15:14:32

트위터 부트 스트랩을 사용하여 끈적 끈적한 navbar 만들기?

답변

관련 문제