Javascript 如何使用jQuery在容器中的元素中设置动画？

我正在使用jQuery编写一个文章转盘，以更好地掌握该框架。我有一个包含div，在这个div中我有多篇文章

<div id="container">
    <article>
        <h3>Article Heading</h3>
        <p>Article Content</p>
    </article>
    <article>
    ...
</div>

但是，当调用scrollNext函数时，它将滚动到下一篇文章的段落，或者按顺序滚动

我想知道这是否是选择器的问题，或者可能是我的页面样式的问题，或者正确的方法是什么。

---

你的利润率把你搞砸了。为什么不试试这样的

var box = $("#container"), height = box.height();
currentPosition++;
box.animate({scrollTop: currentPosition*height});

---

您使用的是

.offset（）

，它提供了与主体相比的偏移量

由于要在

div#容器中滚动

，因此需要使用

.position（）

使用

position（）

要求div

#container

为

position:relative在css中

一旦在jQuery中有了它，您需要更改scrollTop动画，将
div#container
的
scrollTop（）
添加到下一篇文章的
position（）

像这样：

$('#container').animate({
  scrollTop: $('#container').scrollTop() + $(pdiv).position().top
}, 750);

您可以在更新的JSFIDLE中看到这一切：

你能给一个可编辑的演示添加一个链接吗（使用在线站点，如）？@MattCoughlin刚刚用一个链接编辑了这个问题！很好用！谢谢@Kolink
$('#container').animate({
  scrollTop: $('#container').scrollTop() + $(pdiv).position().top
}, 750);