javascript - 滚动位置在底部时更改为固定定位

Question

基本上，我正在检查滚动位置是否在页面底部，并根据它添加和删除一个类。但是，当删除固定类时，我无法滚动到页面底部。浏览器已经假定我在底部。我该如何纠正这个问题？如果这没有意义，请告诉我。下面是我的代码:

JavaScript :

function fixedToRelative(){
    var scrollPos = $(window).scrollTop() + $(window).height();
    if(scrollPos == $(document).height()) {
        $('.mobile.full').removeClass('fixed');
    } else {
        $('.mobile.full').addClass('fixed');
    }
}

样式:

.mobile { position:relative; }
.mobile.fixed { position:fixed; bottom:0; left:0; right:0; }

Answer 1

我认为当您滚动到页面底部时，您正在尝试追加 .fixed 类。如果是这样，您可以执行以下操作:

Codepen

$(window).on('scroll', function(){
    var scrollPos = $(this).scrollTop() + $(this).height(); // Current Scroll position plus height of window
    var atBottom = (scrollPos == $(document).height()); // Returns true/false based on if at bottom
    $('.mobile').toggleClass('fixed', atBottom); // If at bottom of page, fixed class is appended
});