滾動位置全高絕對導航問題

Question

好的，我看到了一些類似問題的示例，但似乎並沒有回答我當前的具體問題。 我要做的就是讓側面導航使用100％的高度。 我已經嘗試了很多關於高度，浮點，位置的嘗試，但是它似乎仍然只能在加載時填充渲染的視口。 我如何才能可靠地拉伸所有內容的整個高度？ 如果您在下面的示例中向下滾動，您將明白我的意思。

示例： Codepen

我已經嘗試過類似的東西；

position:absolute;
left:0;top:0;bottom:0;

。

  float: left;

。

height: 100%

當我進行網絡技能訓練時，我有時會變得謙卑。 因此，如果確實有重復的內容，我沒有找到，請告訴我，我將解決這個問題。 謝謝！

Answer 1

您可以使用jQuery來獲取頁面的高度，然后將nav設置為頁面的高度：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js">

<script>

$(function(){

var height = $(window).height();
$("#nifty-sidenav").height(height+"px");

});

</script>

Answer 2

您是否嘗試過使用固定裝置？ 我嘗試了一下，導航欄不斷擴大。

或者，如果您可以使用200％或300％，則可能滿足您的需求

Answer 3

給予位置：相對於父母

在這種情況下：

body {
    position:relative;
}