jQuery滚动限制到子级

我正在使用jQueryScrollto，试图创建一个具有完整主体部分的平滑滚动站点。滚动和转换工作正常，除非从第一个部分向上滚动，否则脚本会将导航面板作为一个部分高亮显示，而不是停留在第1部分

例如：

以下是导航的外观：

<div id="header">
  <ul id="nav">
    <li><a href="#section-1">Section 1</a>
    </li>
    <li><a href="#section-2">Section 2</a>
    </li>
    <li><a href="#section-3">Section 3</a>
    </li>
  </ul>
</div>

我似乎找不到从滚动中排除导航面板的方法，因此当在第一个面板上时，向上滚动不会产生任何效果

另外，当您刷新较低部分上的页面时，是否有方法将当前可见部分重置为第一个，因为此时窗口保持在当前的位置

---

任何帮助都将不胜感激

您没有检查prev和next是否仍然是有效元素。 这里有一个更好的方法，没有测试过，如果有任何小问题，请调整

$(function() { 
  $('#nav').onePageNav();

  $('body').mousewheel(function(event, delta) {
    event.preventDefault();

    var $current = $('div.current');
    if ($current.is(':animating')) return;

    var $next = delta > 0 ? $current.prev() : current.next();
    if (!$next.hasClass('section')) return;

    $current.removeClass('current');
    $next.addClass('current');
    $(window).scrollTo($next, 500);
  });
});

顺便说一句，如果你使用scrollTo，使用onePageNav是一种浪费。您也可以通过包含使用scrollTo而不重新实现整件事情的内容来实现这一点

或者，您可以像下面这样很快地实现它：

// Bind to the click of all links with a #hash in the href
$('a[href^="#"]').click(function(e) {
  e.preventDefault();
  $(window).stop(true).scrollTo(this.hash, {duration:500, interrupt:true});
}); 

---

谢谢你的回复，但是你提供的代码不起作用。我看了一下localScroll，但是我找不到任何关于使用鼠标在一个漂亮的动画中滚动的信息（它只在点击时才动画）。我说它可以取代onePageNav，而不是全部。鼠标滚轮部分需要单独完成。我修复了代码中的一个错误，您现在可以重新测试。复制您的案例来测试代码实际上需要很长时间，如果您要制作一个JSFIDLE或类似的脚本，那么尝试不同的脚本要快得多顺便说一句，您提供的HTML与站点中的HTML不同，站点在节之前有一个#header元素

// Bind to the click of all links with a #hash in the href
$('a[href^="#"]').click(function(e) {
  e.preventDefault();
  $(window).stop(true).scrollTo(this.hash, {duration:500, interrupt:true});
});