Javascript 当页脚滚动到视图中时，如何向上推固定边栏-请不要使用第三方库

我看到了一个可能的解决方案，但我希望我可以做到这一点，而不必在我不断增长的包含库列表中添加第三方插件

我有一个简单的Bootstrap 4布局、一个主col-8部分、一个secon col-4侧边栏和一个页脚下面：

<div class="container-fluid">
<div class="row row-eq-height m-0 p-0 h-100">
     <div class="col-12 col-lg-7 col-xl-8 order-2 order-lg-1 py-3">MAIN CONTENT</div>
     <div class="col-12 col-lg-5 offset-lg-7 col-xl-4 offset-xl-8 order-1 order-lg-2 p-0 fixed-side">SIDEBAR</div>
</div>
</div>
<footer class="container-fluid container-footer pt-4 pb-1"></footer>

主要内容
边栏

我想做的是允许用户滚动查看

MAIN

列，而

固定侧边栏保持固定
（class FIXED SIDE设置位置：FIXED，top:inherit，z-index:0）
。当页脚进入视图时，我想将顶部值偏移页脚所看到的像素数

我在开发人员工具中测试过，这可能是操纵
固定侧边栏顶部值的最简单方法。我只是不知道如何定位元素的“窗口内”高度

我希望在javascript或jQuery中实现这一点，而不是导入新脚本并调用该脚本。
考虑使用
position:sticky-它可以帮助实现“固定位置”边栏，但仍然允许在主
中滚动

考虑使用
位置：粘性-它可以帮助实现“固定位置”边栏，但仍然允许在主
中滚动

您能将此处的代码转换为再现当前行为的工作堆栈片段吗？您能将此处的代码转换为再现当前行为的工作堆栈片段吗？该死！非常感谢。该死的！非常感谢。