固定div但在页脚之前停止

Question

我需要固定的div（边栏），但必须在页脚之前停止。我写了代码，已经使用了一个星期了，但是我做不到 -> pastebin.com/q85pPBpc

Answer 1

有一个非常简短的CSS解决方案。它来自Bootstrap4。我想这就是您所需要的。

您的网站应具有以下结构：

<header></header>
<main>
    <aside class="sticky-top"></aside>

    <section></section>
    <section></section>
    <section></section>
</main>
<footer></footer>

简单的CSS会使侧边栏aside变得粘滞，它将保留在主要部分中，而不会放在页脚。

@supports ((position: -webkit-sticky) or (position: sticky)) {
   .sticky-top {
       position: -webkit-sticky;
       position: sticky;
       top: 0;
       z-index: 1020;
   }
}