2

我正在使用 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 中使用了溢出:隐藏,并且 $(window).scrollTop() 始终给出 0 值。

任何人都有任何解决方案(我是 jquery 的新手)?

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

4

1 回答 1

0

滚动条可能不在正文上,而是在另一个元素上,如果是这种情况,那么:

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

然后获取 (element with scrollbar).scrollTop() 而不是 window.scrollTop()

代替

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

var withScrollbar = $('#elementWithScrollbar');
var window_top = $(withScrollbar).scrollTop();
于 2013-12-01T08:06:42.723 回答