JQuery 滚动到下一个/上一个 div答案

【解决方案1】：

$('#container').animate({
     scrollTop: <value>
}, 500);

你实际上并不需要那个插件。您可以使用上面的 sn-p 滚动到偏移量。

编辑：

假设您有一个带有以下标记的菜单：

<ul class="menu">
    <li><a href="#" data-for="section_2">Section 2</a></li>
    <li><a href="#" data-for="section_3">Section 3</a></li>
    <li class="last"><a href="#" data-for="section_4">Section 4</a></li>
</ul>

...那么 Javascript 代码将如下所示：

$('.menu li a').click(function() {
    $('#container').animate({
        scrollTop: $('.' + $(this).data('for')).position().top + $('#container').scrollTop()
    }, 500);
    return false;
});

如果您实际滚动的是body，那么$('#container') 将变为$('html, body')。 html 和 body 都是为了兼容 IE。

我没有使用 html 和 body 元素，因为在 iOS 5 上存在一些问题。因此，该问题的解决方法如下所示：

<body>
  <div id="container">
    rest of the page comes here
  </div>
</body>

以及用于此的 CSS 代码：

#container {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  overflow-y: auto;
}

所以在你的情况下，我假设你有一些这样的标记：

<div id="container">
   <div class="post active"></div>
   <div class="post"></div>
   <div class="post"></div>
   <a id="next" href="#">Next</a>
</div>

还有一些 JS：

$('#next').click(function() {
    $('#container').animate({
        scrollTop: $('.post.active').next().position().top + $('#container').scrollTop()
    }, 500);
    $('.post.active').removeClass('active').next().addClass('active');
    return false;
});

当然，您还需要窗口上的滚动事件侦听器来检查哪个帖子在视口中，以便您可以向其中添加“活动”类。

【讨论】：

感谢您的意见。我是 JQuery 的真正新手，所以不确定您的建议。我的意图是有一个下一个/上一个按钮，可以让用户上下滚动浏览所有具有相同类的 div 页面：“post”。我不知道值是多少。
我添加了更多信息。希望能帮助到你。不要因为 jQuery 插件不工作而惊慌失措。有一堆好久没更新了。
谢谢，我试过了，但没用。 $('.' 我很好奇那是什么，并按原样和 .post 进行了尝试，但都没有成功。
P.S.我正在滚动身体。
再次感谢。它开始起作用了。有点儿。我需要编写代码将活动类添加到文档加载的第一篇文章中，但是在 Google Chrome 中使用“检查元素”伪造了这个，我注意到它只工作一次。再次单击同一按钮会滚动到正文顶部，而不是下一篇文章。您可以在这里亲自查看：thomasgrist.tumblr.com.