Question

很抱歉这个混乱。基本上我试图为标题中的目标链接提供可滚动感知的活动状态。由于这是一个单页设计，当用户滚动页面时，我希望主导航切换到活动状态，因为它们通过页面上的目标部分。现在我只是使用代码来识别目标ID和动画。不知道如何根据滚动位置将其调整为addClass和removeClass。

$('a[href*=#]').click(function() {
if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
  var $target = $(this.hash);
  $target = $target.length && $target || $('[name=' + this.hash.slice(1) +']');
  if ($target.length) {
    var targetOffset = $target.offset().top - 60;
    $('html, body').animate({scrollTop: targetOffset}, 400, function() {
          if (!location.hash) window.location += target;
      });
  }
}

}）; }）;

Answer 1

这仍然是一项正在进行的工作，其他人可能会提出改进建议，但我认为这是你想要的？ http://jsfiddle.net/nickywaites/5wzXL/

你肯定想要添加的一件事是在Windows滚动事件上进行去抖或限制。一旦我得到更多的时间，我会更新这个。如果您发布了一些HTML标记，可能会有所帮助。

我创建了一个更新，删除了上面示例中的一些硬编码值http://jsfiddle.net/nickywaites/5wzXL/1/

好的，希望最后编辑http://jsfiddle.net/nickywaites/5wzXL/3/。您可能需要再次点击运行按钮才能使其正常工作。

addClass和removeClass基于单页设计的位置

1 个答案: