スライド/次のナビゲーションメニュー

Question

ユーザーがページを下にスクロールしたときに、ナビゲーションサイドバーをスムーズに追っていくための簡単なjQueryまたはJavascriptソリューションを探しています。 ここのようなもの：http://ucon-acrobatics.com/shop/

いずれかのアイデアがあります。

Answer 1

まず、トップの位置を取得：

$(window).scroll(function() { 
    if($(this).scrollTop() >= offset_top) { 
    $("#menu").css("top", $(this).scrollTop() - position_top); 
    } 
}); 

も参照してください私の例：http://jsfiddle.net/elektronikLexikon/LaVmG/

または第二版でanimateリンクに変更します。http://jsfiddle.net/elektronikLexikon/LaVmG/2/

offset_top = $("#menu").offset().top  // absolute 
position_top = $("#menu").position().top // relative to parent 

が続いてイベントを作成します

Answer 2

最も簡単な方法は、position:fixedをナビに使用することです。これはあまり遅れていないという利点があります。

ユーザーがposition:fixedに移動する前に特定のポイントを過ぎてスクロールするまで、position:absoluteを使用することができます。