twitterのブートストラップを使ってスティッキーなnavbarを作成していますか？

Question

私はナビゲーションバーを導入しようとしています。これは、もはや見えなくなったときに、固定ヘッダーの位置付けを採用しています。私はこのスレッドを使用して始めました：Replicating Bootstraps main nav and subnav。

それ以来、私は到着しました：http://jsfiddle.net/yTqSc/2/。

問題：

アンカーリンクがナビゲーションバーは、その元位置にあるときはいつでも（その中の先の見出しを隠す）、それらの標的をオーバーシュートしますが、それが固定されていない一度。私はオーバーシュート（私はhttp://nicolasgallagher.com/jump-links-and-viewport-positioning/demo/を参照してください）を修正することができますが、その後、ナビゲーションバーが修正されたときにリンクを使用して過剰なギャップができます。

navbarが固定されているかどうかにかかわらず、誰でも一貫した結果を得る方法をアドバイスできますか？

ありがとうございました。

Answer 1

これはあなたが探しているものですか？

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

Answer 2

あなたはnavbar-fixed-top用のCSSを持っていません。また、スクロールして戻るときに処理する必要があります。

を参照してくださいデモ http://jsfiddle.net/yTqSc/39/

はJavaScript

$(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

。

Answer 3

はそれは素敵でしたが、私はこのように、代わりに上から下に粘着性のNAVを実装するためにクレイジーだ：http://golkhaneh.tv3.ir/

それをどのように行うことができますか？