javascript - 到达页面顶部时删除类？

Question

我正在使用以下脚本添加阴影和固定到我的标题的位置。但是，当用户一直滚动到顶部时，如何删除该类？

这是我的脚本：

$(function() {
 $(window).scroll(function() {
    var top_offset = $(window).scrollTop();
    if (top_offset) {
      $('.top_head_separator').addClass('fixed-top fade-in');
  }
});

当滚动条位于最顶部时，如何反转它？

Answer 1

检查是否top_offset是0，如果是则使用removeClass。

jsFiddle 显示 top_offset 的值

$(function () {
    $(window).scroll(function () {
        var top_offset = $(window).scrollTop();
        if (top_offset == 0) {
            $('.top_head_separator').removeClass('fixed-top fade-in');
        } else {
            $('.top_head_separator').addClass('fixed-top fade-in');
        }
    })
});

Answer 2

$(function() {
 $(window).scroll(function() {
    var top_offset = $(window).scrollTop();
    if (top_offset === 0)
      $('.top_head_separator').addClass('fixed-top fade-in');
    else if (top_offset > 100) // or something else
      $('.top_head_separator').removeClass('fixed-top fade-in');
  }
});

Answer 3

• 用于window.pageYOffset;获取当前滚动位置。

• 检查当前位置是否是顶部并使用removeClass