javascript - 单击链接时使用 jQuery.ScrollTo 向下滚动

Question

我的页面类别顶部有一个链接，当单击它时，页面跳转到目标 div 所在的底部

我正在尝试使用 jQuery.ScrollTo 但它不起作用。我不确定如何调试。

 $(document).ready(function()
{


    // Scroll the content inside the #scroll-container div
    $('.categories_link').scrollTo({
       target:'#categories'
    });

});

更新： 找到这个http://jsfiddle.net/VPzxG/所以现在尝试修改它。任何帮助，将不胜感激。

Answer 1

你根本不需要 JS。只需使用

<a class="categories_link" href="#categories">Click me!</a>

演示：http: //jsfiddle.net/ezCFC/

Answer 2

首先，我建议将 HTML 更改为以下内容：

<div id="sidebar">
    <ul>
        <li><a href="#about">auck</a></li>
        <li><a href="#projects">Projects</a></li>
        <li><a href="#resume">Resume</a></li>
        <li><a href="#contact">Contact</a></li>
    </ul>
</div>

然后只需使用.animate()and .offset()：

$(function(){
    $("#sidebar > ul > li > a").click(function(e) { 
        e.preventDefault(); 
        var id = $(this).attr("href");
        $('body').animate({
            scrollTop: $(id).offset().top
        }, 1000);     
    });
});

演示：http: //jsfiddle.net/dirtyd77/VPzxG/1465/