Javascript 接近页面底部时添加/删除类

我有下面的jquery，它在用户点击页面底部时添加或删除一个类。我想调整这段代码，以便在用户接近底部时，或者底部进入视口时实现更改

非常感谢您的帮助

JS

// Add/remove class to/from .logo upon reaching bottom of page
$(window).scroll(function() {
   $(".logo").removeClass("viewport-bottom");
   if($(window).scrollTop() + $(window).height() === $(document).height()) {
       //you are at bottom
       $(".logo").addClass("viewport-bottom");
   }
});

---

难道你不能直接减去数字来验证什么时候该加或减吗？例如，下面不是说如果它在距离终点50像素的范围内，隐藏并显示

// Add/remove class to/from .logo upon reaching bottom of page
$(window).scroll(function() {
   $(".logo").removeClass("viewport-bottom");
   if($(window).scrollTop() + $(window).height() === $(document).height() - 50) {
       //you are at bottom
       $(".logo").addClass("viewport-bottom");
   }
});

更改减去的值以满足您的需要。 使用

==

仅在滚动条位于该像素处时有效

$(window).scroll(function() {
   $(".logo").removeClass("viewport-bottom");
   if($(window).scrollTop() + $(window).height() > ($(document).height() - 100) ) {
       //you are at bottom
       $(".logo").addClass("viewport-bottom");
   }
});