我如何計算固定位置。在頁面上疊加？

假設我有一個導航條div，它位於頁面頂部的fixed位置，其餘的網頁在其下方滾動。我如何計算固定位置。在頁面上疊加？

如何告訴頁面，當用戶按下Page Down或空格鍵向下滾動一頁高度時，頁面滾動的距離將考慮可見內容區域，以便下一句的第一句「頁面」不會隱藏在導航欄下。也就是說，我希望它滾動（僞代碼）browser_height - height_of_navbar

如果可能的話，更簡單的CSS解決方案將是首選，但如果這是需要的話，我可以開放JavaScript解決方案。

2015-08-08 bobtiki

爲身體添加邊緣頂部。

CSS：

BODY { 
    margin-top: <navbar height + offset here> 
}

2015-08-08 23:24:12

我測試了這個;不起作用。海報希望頁面底部的內容隱藏在固定導航欄下。這似乎仍然發生，即使在保證金添加到身體，至少在Chrome中。瀏覽器仍然會考慮應該滾動的「頁面」的頁邊空白部分。 – benjarwar

使用填充不能保證金 – nothingisnecessary

添加這些樣式：

html, body { 
    overflow: hidden; 
    height: 100%; 
}

這將防止整個頁面由滾動。

這些樣式添加到您的內容（其他城市100到您的導航欄的高度）：

.content { 
    overflow: auto; 
    margin-top: 100px; 
    height: calc(100% - 100px); 
}

這將會把滾動條上的內容，而不是窗戶。

2015-08-08 23:38:06

回答