0

重複の可能性:
特定の DIV コンテンツをブラウザのメイン スクロールバーでスクロールする

「エクスプローラーのメイン スクロールバーを使用して特定の div をスクロールし、固定 (位置: 固定) ヘッダーの下にコンテンツを非表示にする」を複製しようとしています。

このウェブサイトで例を見てください。ご覧のとおり、Web サイトでは、中央のコンテンツはウィンドウのメイン スクロールバーでスクロールでき、コンテンツの種類は固定ヘッダーの「下」に隠れています。

以下は、本文(中央のコンテンツ)に使用する CSS です。

#body {
    position: relative;
    padding: 0;
    margin-left: 320px;
    margin-top: 130px;
    width: 500px;   
}

これは、固定ヘッダーの CSS です。

#header {
    position: fixed;
    top: 0;
    text-shadow:0 -1px 0 rgba(0,0,0,0.5);   
    width: 100%;
    height: 130px;
    z-index:2;
}

現在、中央のコンテンツは固定ヘッダーの下にスクロールされていますが、私のヘッダーは単なる PNG 画像であるため、そこに表示されます。そのため、スクロールしているときにヘッダー画像の下にテキストが流れるように表示されます。

4

2 に答える 2

2

実際のボディの背景と同じ背景画像 (同じテクスチャ) をヘッダーの背景に使用すると、目的の効果が得られます。

http://jsbin.com/uqimac/1/edit

于 2013-01-19T13:52:29.333 に答える
0

コンテンツ div には次のものが必要です。

#content {
  height:500px; /* some fixed height */
  overflow:hidden; /* hide the scrollbars */
}
于 2013-01-19T13:51:27.683 に答える