Question

我正在使用fullpage.js开发一个完整的网页。我有一个固定的导航栏。我想通过添加和删除css类来更改导航栏上的徽标。我试过这段代码：

function sticky_relocate() {
  var window_top = $(window).scrollTop();
  var div_top = $('#sticky-anchor').offset().top;
  if (window_top > div_top)
    $('#sticky').addClass('stick')
  else
    $('#sticky').removeClass('stick');
}

$(function() {
  $(window).scroll(sticky_relocate);
  sticky_relocate();
});

但它不起作用可能是因为溢出：在fullpage.js和$（窗口）中使用隐藏.scrollTop（）始终给出0值。

任何人都有任何解决方案（我是jquery的新手）？

编辑：如果我不使用fullpage.js插件，代码工作正常。 fullpage.js使用overflow：hidden和position：relative在body标签中隐藏滚动条。示例网站http://alvarotrigo.com/fullPage/

Answer 1

可能是滚动条不在主体上但在另一个元素上，如果是这样的话，那么：

通过直接在滚动条上使用inspect元素找出哪个元素具有滚动条。

然后get（带滚动条的元素）.scrollTop（）而不是window.scrollTop（）

替换

var window_top = $(window).scrollTop();

与

var withScrollbar = $('#elementWithScrollbar');
var window_top = $(withScrollbar).scrollTop();

如何添加一个类在到达特定div时删除一个类（溢出隐藏）

1 个答案: