简单的 jQuery scrollTo 将不起作用/动画答案

【问题标题】：Simple jQuery scrollTo will not work/animate简单的 jQuery scrollTo 将不起作用/动画
【发布时间】：2014-02-05 20:56:26
【问题描述】：

我有一个带有基本导航的固定标题栏，如下所示：

<html>
<head></head>
<body>
<ul class="nav navbar-nav">
  <li><a id="aboutme" href="#about-me">About</a></li>
  <li><a id="workme" href="#work-me">Work</a></li>
  <li><a id="contactme" href="#contact-me">Contact</a></li>
</ul>
...
..
.
<div id="about-me">
</div>
</body>
</html>

我希望这些使用“线性”、“慢”动画值定向到同一页面中的一个部分，但我的代码不起作用：

$(document).ready(function() {

  $('aboutme').click(function() {
    $.scrollTo($("#about-me"),{duration: 1});
  });
});

你知道我的语法哪里出错了吗？我是否需要使用 github 上的 jQuery animatedScroll 来实现这一点？

谢谢:)

【问题讨论】：

您是否有一个插件可以为您提供$.scrollTo 功能，或者它只是您出于某种原因尝试过的？
$('aboutme').click 必须是$('#aboutme').click ??假设您使用的是解释其他语法代码的插件。
这个函数中没有使用插件，但是github上有一个叫做“animatedScroll”的插件

标签： jquery scroll jquery-animate href jquery-scrollable

【解决方案1】：

无论如何，这里是如何在没有插件的情况下为滚动设置动画？

$(document).ready(function() {
    $('#aboutme').click(function(e) {
       e.preventDefault();
       $('body, html').animate({scrollTop : $('#about-me').offset().top}, 'slow');
    });
});

【讨论】：

【解决方案2】：

我猜你正在使用这个ScrollTo 插件。

在你的函数中首先引用你的按钮，你有：

$('关于我')

必须是

$('#aboutme')

然后像这样使用, 设置时间值：

$('#aboutme').click(function(e) {
  e.preventDefault();
  $.scrollTo($("#about-me"),800);
});

检查这个Demo Fiddle

【讨论】：