JQuery实现<a>标签平滑滚动到指定节点位置代码片段

风信建站项目开发过程中应用到使用animate动画函数实现<a>标签平滑滚动到指定节点位置，这种效果比起使用scroll到指定地点，用户在体验中会感觉更平滑，当然两种方法各有所长，分享项目实战片段代码如下：

HTML代码：

<div class="container-fluid">
    <div class="row">
        <div class="col-lg-1 navbar-fixed-top">
            <h1 class="logo"><a href="">​快乐校外</a></h1>
        </div>
        <div class="col-lg-8 col-md-offset-3">
            <ul id="navmenu">
                <li><a href="/" title="首页">​首页</a></li>
                <li><a href="#teacher" class="topLink" title="​浏览教师">​浏览教师</a></li>
                <li><a href="/" title="开始约课">​开始约课</a></li>
                <li><a href="#process" class="topLink" title="上课流程">​上课流程</a></li>
                <li><a href="/" title="最新动态">最新动态</a></li>
            </ul>
        </div>
    </div>
</div>   

JQuery代码：

$(document).ready(function() {
  $("#navmenu li a.topLink").click(function() {
    $("html, body").animate({
      scrollTop: $($(this).attr("href")).offset().top + "px"
    }, {
      duration: 1000,
      easing: "swing"
    });
    return false;
  });
});

效果截图如下：