javascript - 将固定侧边栏停止在页脚处 - 防止重叠

标签 javascript jquery css

侧边栏在距离顶部 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();
});

该代码效果很好。但侧边栏与页脚重叠。我怎样才能防止这种情况发生?

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

How to prevent fixed button from overlapping footer area and stop the button on top of where the footer is located

Stop fixed position at footer

Fixed sidebar on the scroll stop at div

我很确定,我在混合代码时犯了一个错误。

感谢您的帮助。

最佳答案

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

关于javascript - 将固定侧边栏停止在页脚处 - 防止重叠,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37167881/

相关文章:

javascript - 编写将所有内容都放在变量中的 Javascript 代码

javascript - 使用 jQuery draggable 将元素拖到可滚动的 div 之外

javascript - 如何为不同部分触发不同模态

html - 为什么 wordpress 生成随机 <br> 并错开我的图像

html - 我们如何在较小的屏幕尺寸下调整(缩小)div 的背景图像

javascript - Ajax 在登录表单中显示错误而不重新加载页面

javascript - 设置表单部分不可见

javascript - 使用 Socket.IO 进行授权和握手

javascript - JQuery 在 div 中查找和替换

javascript - 显示单词的代码,JS Jquery