javascript - 当我们单击 jquery 垂直选项卡菜单时如何使页面滚动位置到顶部

标签 javascript jquery html css

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

//脚本1 $(文档).ready(函数(){

    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>

最佳答案

添加

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

点击函数。

关于javascript - 当我们单击 jquery 垂直选项卡菜单时如何使页面滚动位置到顶部,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20364591/

相关文章:

javascript - 如何在 JavaScript 中模拟数据库限制?

javascript - Reactjs模块构建错误

javascript - 无法使用javascript从网址获取文本数据

javascript - 在完整网站上搜索并替换为 JQuery、php 或其他内容

javascript - 使用列表项之间的类循环淡入淡出动画

html - 后台附件:已修复在 iOS 上不起作用

php & javascript 打开窗口函数

javascript - 错误 : Invalid value for <g> attribute transform ="scale(NaN) translate(NaN, NaN)"

javascript - 如何使用 pdf.js 呈现 pdf 文件?

html - 子菜单无法正常工作