jquery - Jquery 不滚动到元素

Question

那是我的笔：

http://codepen.io/helloworld/pen/EAfFD

我希望 jquery 能够滚动到 id4 的元素，但没有任何反应。

为什么？

<div id="container">
  <div id="id1" style="height:400px;background:blue;"></div>
  <div id="id2" style="height:400px;background:red;"></div>
  <div id="id3" style="height:400px;background:green;"></div>
  <div id="id4" style="height:400px;background:orange;"></div>
</div>

$(document).ready(function() {

 var container = $('#container');
 var scrollTo = $('#id4');

container.animate({scrollTop: scrollTo.offset().top  - container.offset().top + container.scrollTop()
            });
});

Answer 1

尝试：

var container = $('html,body');
var scrollTo = $('#id4');
container.animate({
        scrollTop:scrollTo.position().top
}, 'slow');

演示:: jsFiddle

Answer 2

您尝试执行的代码会出现以下错误：

未捕获的 ReferenceError：$ 未定义

这意味着不包括 jQuery。

如果这不能解决它，也尝试改变

container.animate(
{
    scrollTop: scrollTo.offset().top  - container.offset().top + container.scrollTop()
});

至

$('html, body').animate(
{
    scrollTop: scrollTo.offset().top  - container.offset().top + container.scrollTop()
});

这是一个例子。