Javascript 当我们单击jquery垂直选项卡菜单时，如何使页面滚动到顶部

我的演示链接：，当我点击垂直选项卡时，我试图使页面滚动

//脚本1 $（文档）.ready（函数（）{

html源代码

 <ul>
    <li><a href="#a">a</a></li>
    <li><a href="#b">b</a></li>          
    </ul>
    <div id="sections">
    <div class="section" id="a">
    </div>
    <div class="section" id="b">
    </div>

添加

---

点击功能。

@dollarvar的答案并不完美

$('html').scrollTop(0); -- for IE only
$('body').scrollTop(0); -- for all browsers except IE
$('body,html').scrollTop(0); -- for all browser

我做了一个快速演示。下面是代码：

HTML:

用于测试的空白空间




内容A.内容A.内容A.内容A.内容A.内容A.内容A。
内容B.内容B.内容B.内容B.内容B.内容B。
空的测试空间

JQuery：

<script type="text/javascript">
$(document).ready(function(){
    $("#verticalNav a").click(function(){
        // show or hide content
        $($(this).attr("href")).show().siblings().hide();

        // scroll to the position of #verticalNav
        $('body,html').animate({
            scrollTop: $("#verticalNav").offset().top
        }, "slow");

        return false;
    });
});
</script>

$（文档）.ready（函数（）{
$（“#垂直导航a”）。单击（函数（）{
//显示或隐藏内容
$（$（this.attr（“href”））.show（）.sides（）.hide（）；
//滚动至垂直导航的位置
$（'body，html'）。设置动画({
滚动顶部：$（“#垂直导航”）.offset（）.top
}“慢”）；
返回false；
});
});

在您的演示中，滚动效果似乎很好。您是否试图实现动画滚动效果？您好，我想显示页眉和页眉。thanks@user2913707我以为你想滚动到垂直导航。你可以滚动到任何你想要的地方。滚动顶部：$（“#标题”）.offset（）.top scrollTop:1000HI谢谢，当我单击垂直选项卡时，我正在尝试显示页眉，我需要用#di显示下面的链接。谢谢

$('body').scrollTop(0);

$('html').scrollTop(0); -- for IE only
$('body').scrollTop(0); -- for all browsers except IE
$('body,html').scrollTop(0); -- for all browser

    <div style="height:400px; line-height:400px; background-color: gray; text-align:center; color:white; margin:20px;">Empty space for test</div>
    <ul id="verticalNav">
        <li><a href="#a">a</a></li>
        <li><a href="#b">b</a></li>
    </ul>
    <div id="sections">
        <div class="section" id="a">Content A. Content A. Content A. Content A. Content A. </div>
        <div class="section" id="b" style="display: none;">Content B. Content B. Content B. Content B. Content B. </div>
    </div>
    <div  style="height:800px; line-height:800px; background-color: gray; text-align:center; color:white; margin:20px;">Empty space for test</div>

<script type="text/javascript">
$(document).ready(function(){
    $("#verticalNav a").click(function(){
        // show or hide content
        $($(this).attr("href")).show().siblings().hide();

        // scroll to the position of #verticalNav
        $('body,html').animate({
            scrollTop: $("#verticalNav").offset().top
        }, "slow");

        return false;
    });
});
</script>