防止侧边栏菜单滚动到页脚下方答案

【问题标题】：Prevent sidebar menu from scrolling below footer防止侧边栏菜单滚动到页脚下方
【发布时间】：2017-03-06 02:07:44
【问题描述】：

我有一个p

还有css：

.sidebar-menu {
    float: right; 
    position: relative;
    visibility: hidden;
    
}

.sidebar-content {
    color: #5bc5f2; 
    font-weight: bold; 
    position: fixed;
        top: 75px;
    
}

目前，侧边栏菜单以 80 像素（很好）固定在顶部，基本上我希望它在达到某个特定点时停止滚动。有什么帮助吗？

【问题讨论】：

你能用 jsfiddle 添加你的代码吗？
我无法得到您的答复。页面靠近页脚时要隐藏侧边栏吗？？

标签： javascript jquery html css sticky-footer

【解决方案1】：

$(document).on("scroll",function () {
        if (parseInt($(this).scrollTop()) > $("footer").offset().top-500) {
    $(".sidebar-menu").removeClass("fixed");
    $(".sidebar-menu").hide();
} else {
    $(".sidebar-menu").addClass("fixed");
   $(".sidebar-menu").show();
}}

【讨论】：

您是否从导航栏中删除了固定位置？只需使用该类应用固定位置
我可以添加另一个答案，因为我不能在这里解释
@Araz 如果这不能回答问题，请不要添加另一个。编辑此答案，因为它可能会被否决甚至删除。

【解决方案2】：

$(document).on("scroll",function () {
    var offsetToTop = parseInt($(this).scrollTop());
        if (offsetToTop > $("footer").offset().top-500) {
    $(".sidebar-menu").removeClass("fixed");
    $(".sidebar-menu").addClass("absolute");
    $(".sidebar-menu").css("top",offsetToTop)  
} else {
    $(".sidebar-menu").addClass("fixed");
    $(".sidebar-menu").removeClass("absolute");
    $(".sidebar-menu").removeAttr("style");
}}

在绝对类中，只需将位置设为绝对。

【讨论】：

好的，当您删除固定类时，请查看我的 prevois 答案，只需 $("sidenav").hide() 并在另一边将其设为 $("sidenav").show()