スクロール中にヘッダー/ツールバーがページ上部に静的に表示される

Question

現在、多くのサイトで、ページの途中にツールバー/表ヘッダーがあるとします。 スクロールを開始すると、ヘッダーまたはツールバーが表示されなくなり、選択した行に対して操作を実行できなくなったり、列のヘッダーの名前が表示されなくなります。

多くのサイトでこれが行われています。ブラウザの上部にあるツールバー/ヘッダーをスクロールし始めると、これは素晴らしいことです。ヘッダー/ツールバーが通常表示されない地点までスクロールする場合にのみ、これはすぐには起こりません。

どうすればいいですか？この機能の名前はありますか？

電子メールを読むときにスクロールすると、上のツールバーが一番上に固定され、電子メールのラベル付け/移動/迷惑メールを行うことができます。

Answer 1

あなたが探しているものである必要がありますjQuery Waypoints - Sticky elementsを見てください。

Answer 2

使用このCSS：

.static{ 
    position:fixed; 
} 

そして、あなたのヘッダ要素にclass="static"を置きます。

これが役に立ちます。乾杯

Answer 3

この問題を解決するにはJavascriptは必要ありません。自分ではそれを困難にしないでください。固定の位置付けを使用すると、ヘッダーがコンテンツの上に「ホバー」し、スクロールすると、ページの上部ではなく画面の上部にとどまります。このCSSを使用してヘッダを修正することができます。

.header { 
    position: fixed; 
} 

divに「header」クラスを割り当てていることを確認してください。設計上の理由から、私はあなたのヘッダーを画面の一番上に置き、全体を伸ばすことをお勧めします。このCSSを使用すると、そうすることができます。

.header { 
    top: 0px; 
    left: 0px; 
    width: 100%; 
} 

技術的に、あなたは「トップ」または「左」の位置を指定する必要はありませんが、それはあなたが後でそのような何かを変更することを決定したならば、あなたは間違って行くことは何もありません保証します。 this siteで他のタイプの測位を見ることができます。