使用固定頁眉/頁腳移動頁面上的內容

你好，我正在建立一個移動網頁，我的內容只會滾動，我的頁腳和頁眉位置：固定 - 我可以讓內容不滾動頁眉或頁腳，這樣它就可以滾動到它自己的div中。使用固定頁眉/頁腳移動頁面上的內容

我之所以要這樣做的原因是，我將在頁眉和頁腳上留下一些不透明的內容，如果內容滾動下來，它看起來不太好。

繼承人的jsfiddle我做只是告訴你滾動

http://jsfiddle.net/VNVqs/

來源

2012-06-05 Fruxelot

你應該刪除所有的位置絕對＆固定高度滾動內容或包裝溢出自動。並刪除從頁眉和頁腳固定的位置。檢查此：http://jsfiddle.net/VNVqs/ – SVS

給你的例子：

http://jsfiddle.net/VNVqs/3/

我只是刪除了滾動部分爲position: absolute （包裝和滾動內容），並將一些padding添加到包裝，以使第一個和最後一個項目不在頁眉和頁腳下。

基本上，特技是通過使用僅position: fixed上頁眉和頁腳，並讓的網頁的其餘部分滾動作爲正常頁完成的，沒有一個具體的固定高度的元件上使用overflow: auto。這樣做，唯一的問題是你的內容的第一行總是在固定位置的標題下（最後一行在頁腳下），但你可以通過在內容包裝器上應用一些填充來解決這個問題，頁眉（和頁腳）高度。你說對了？

來源

2012-06-05 07:41:43

謝謝但內容仍然在標題和頁腳下 - 也許我在解釋問題時有點模糊。我添加了一些不透明的頁眉和頁腳。我只是不希望任何內容能夠在頁眉或頁腳下滾動 - 是否有可能？ http://jsfiddle.net/VNVqs/4/ – Fruxelot

我更新了我的答案，也是示例鏈接。見小提琴的* rev。 3 *。 –

是的 - 第一個和最後一個項目都可以 - 但是當你滾動時，這些項目會在標題後面出現。這是我的問題哈哈！我剛剛更改了頁眉和頁腳上的不透明度，以顯示當頁面滾動時項目在元素後面。 – Fruxelot

使用固定頁眉/頁腳移動頁面上的內容

回答

相關問題