【问题标题】:How to make page scroll to top when click the vertical tab单击垂直选项卡时如何使页面滚动到顶部
【发布时间】:2013-12-03 03:59:14
【问题描述】:

我的演示链接:http://www.bajistech.info/tiltindicators.html#TiltWatch-Plus1,当我单击垂直选项卡时,我正在尝试使页面滚动。

//脚本1 $(document).ready(function(){

    if (
        $('ul#verticalNav li a').length &&
        $('div.section').length
    ) {
        $('div.section').css( 'display', 'none' );
        //$('ul#verticalNav li a').each(function() {
        $('ul#verticalNav li a').click(function() { 
            showSection( $(this).attr('href') );
        });
  // if hash found then load the tab from Hash id
        if(window.location.hash) 
        {
   // to get the div id
           showSection( window.location.hash);
        }
        else // if no hash found then default first tab is opened
        {
            $('ul#verticalNav li:first-child a').click();
        }
    }
});
</script>

//脚本2

function showSection( sectionID ) {
    $('div.section').css( 'display', 'none' );
    $('div'+sectionID).css( 'display', 'block' );
}
$(document).ready(function(){

    if (
        $('ul#verticalNav li a').length &&
        $('div.section').length
    ) {
        $('div.section').css( 'display', 'none' );
        //$('ul#verticalNav li a').each(function() { // no need for each loop
        $('ul#verticalNav li a').click(function() { // Use $('ul#verticalNav li a').click
            showSection( $(this).attr('href') );
        });
        //});
        if(window.location.hash) // if hash found then load the tab from Hash id
        {
           showSection( window.location.hash);// to get the div id
        }
        else // if no hash found then default first tab is opened
        {
            $('ul#verticalNav li:first-child a').click();
        }
    }
});

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>

【问题讨论】:

    标签: javascript jquery html css


    【解决方案1】:

    试试这个:

    $( "#tabs li" ).click(function() {
       //user clicked on the li
       scrollTo(0,0);
    });
    

    $("#tabs li").click( function(){
        var tabs_offset = $("#tabs").offset();
        scrollTo(tabs_offset.left, tabs_offset.top);
    });
    

    【讨论】:

    • 您好 G 先生,谢谢,页面仍无法滚动到顶部。
    • 试试这个 $("html, body").scrollTop($(element).offset().top);在上面的示例中与您的 id 一起使用,否则直接使用。
    • 您好 G 先生,我使用了以下 仍然不可见。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2014-06-19
    • 2015-06-09
    • 2014-09-28
    • 1970-01-01
    相关资源
    最近更新 更多