親のdiv内にある固定ナビゲーション

Question

私は流体幅のウェブサイトを作成しています。私のページの1つに固定サイドバーがあります。私はそれに2つのリンクがあるので、今は正常に動作します。サイドバーはあまり高くありません。レイアウトは、このように書きます：サイドバーと

コンテンツ

ヘッダー

フッター

サイドバーがあるため、ヘッダの遠ダウンかなり配置され、そしてそれはあまりにも背が高くなれば、それはにオーバーフローしますフッター。フッタは一度フッター

相対達するまで

1. 相対スクロールダウン
2. が固定されるまで：私はそれが特定の画面上の高さつまり

   に達すると、それが起動すると「固定」されたいです到達

Answer 1

ああ、私はこの1つだけをした：NAVのスクロール位置を確認するためにjQueryを使用し

ソースの表示方法は、http://trans.worldvision.com.au/ChildSponsorship/ChildSearch.aspxです。

純粋なCSSでこれを実現することはできませんが、残念ながらjQueryや他のJavaScript /ライブラリが必要になります。

レイアウトについて申し訳ありません... iPadには明らかにタブキーがありません。

  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script> 

$(window).scroll(function() { 
               if ($(".csnavHome").position().top < $(window).scrollTop()) { 
                   $(".csnav").css("position", "fixed"); 

                   $(".csnav").css("z-index", "2"); 
               } else { 
                   $(".csnav").css("position", "relative"); 
                   $(".csnav").css("z-index", "0"); 
                   $(".csnav").css("top", "0"); 
               } 
           });