jQuery緩動功能在這里不起作用

Question

文件參考（母版頁）：

    <script src="JavaScript/jquery-1.10.2.min.js"></script>
    <script src="JavaScript/jquery-ui.min.js"></script>
    <script src="JavaScript/JavaScript.js" type="text/javascript"></script>

HTML

<a href="#bookmark1" class="rightLinks">Go to 50s</a>
<a id="bookmark1" class="title">50s</a>

JavaScript.js文件中的代碼

 $(".rightLinks").click(function () {
    var id = $(this).attr('href');
    $('html,body').animate({ scrollTop: (($(id).offset().top) - 30) }, 300, "easeOutCubic");
});

當我刪除'easeOutCubic'時，它可以正常工作：

 $(".rightLinks").click(function () {
    var id = $(this).attr('href');
    $('html,body').animate({ scrollTop: (($(id).offset().top) - 30) }, 300");
});

但是為什么不使用緩動功能呢？

Answer 1

添加此庫jquery.easing.min.js ：

<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js" type="text/javascript">
</script>

添加您的庫：

<script src="JavaScript/jquery-1.10.2.min.js"></script>
<script src="JavaScript/jquery-ui.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js" type="text/javascript">
</script>
<script src="JavaScript/JavaScript.js" type="text/javascript"></script>

輕松演示

Answer 2

您必須在母版頁中添加jQuery UI 1.10引用，僅此而已！

您可以從此處http://jqueryui.com/download/下載