Javascript 在页脚处停止固定边栏-防止重叠

侧边栏在距顶部400像素后固定。因此，我使用堆栈上的以下代码：

<div id="gettop"></div>

<script type="text/javascript">
jQuery(function($) {
function fixDiv() {
var $cache = $('#gettop');
if ($(window).scrollTop() > 400)
  $cache.css({
    'position': 'fixed',
    'top': '8px',
    'margin-left': '20px',
    'border': '1px solid #ccc'
  });
else
  $cache.css({
    'position': 'relative',
    'top': 'auto'
  });
}
$(window).scroll(fixDiv);
fixDiv();
});

jQuery（函数（$）{
函数fixDiv（）{
var$cache=$（'#gettop'）；
如果（$（窗口）.scrollTop（）>400）
$cache.css({
'位置'：'固定'，
“顶部”：“8px”，
“左边距”：“20px”，
“边框”：“1px实心#ccc”
});
其他的
$cache.css({
'位置'：'相对'，
“顶部”：“自动”
});
}
$（窗口）。滚动（fixDiv）；
fixDiv（）；
});

代码工作得很好。但侧边栏与页脚重叠。我怎样才能防止这种情况

我尝试了一些在这里找到的代码，但没有成功

我很肯定，我在混合代码时犯了一个错误

---

感谢您的帮助。

尝试为您想要位于顶部的元素提供更大的z索引。

尝试为您想要位于顶部的元素提供更大的z索引