Запретить прокрутку меню боковой панели ниже нижнего колонтитула

Question

У меня проблема, с которой я имею дело в течение примерно четырех часов, и я абсолютно не знаю, как ее исправить.

У меня есть меню боковой панели (.barbar-content), и я хотел бы остановить его от прокрутки (или просто исчезнуть), когда он достигнет примерно 500 пикселей или выше ВЫШЕ! нижний колонтитул. Любая идея, как это сделать?

Код:

<section class="col-md-3 col-xs-hidden sidebar-menu"> 
<div id="test" class="main col-md-12 pull-right" style="position: fixed;"> 
<ol class="sidebar-content col-sm-hidden col-xs-hidden"> 
//some content 

</ol> 
</div> 
</section> 

//content of page 

<div class="footer footer-inverse"> 

JS/JQuery код ниже:

$(window).scroll(function() { 
    if ($(this).scrollTop() > 700) { 
     $(".sidebar-menu").css('visibility', 'visible'); 

    } 
else if ($(this).scrollTop() < 600) { 
     $(".sidebar-menu").css('visibility', 'hidden'); 
    } 

    else { 
     $(".sidebar-menu").css('visibility', 'visible'); 
    } 

И CSS:

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

} 

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

} 

В настоящее время, в меню боковой панели приклеивается к вершине с 80px (это прекрасно), и в основном я хочу, чтобы он остановил прокрутку, когда достиг какой-то определенной точки. Любая помощь?

Answer 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(); 
}} 

Answer 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"); 
}} 

в абсолютном классе просто сделать позицию абсолютной.