1

我创建了一个位于引导程序导航栏下的自定义“子导航栏”。它基于 wrapbootstrap 的代码。

我想使用 scrolltop 启用平滑滚动。我有以下Javascript:

 $(document).ready(function(e) {

        $('#subnav').bind('click', function(e) {
            e.preventDefault();
            $('html,body').animate({scrollTop: $(this.hash).offset().top});                                                         
        });
    });

但是,我似乎无法让它工作。我是否使用了错误的 # 参考?这是一个引导:http: //bootply.com/62720

下面的 HTML 片段:

                     <!-- Subnav bar -->                
                     <div class="subnav subnav-fixed">
                        <ul class="nav nav-pills">
                           <li><a href="#overview">Overview</a></li>
                           <li><a href="#opening-hours">Opening hours</a></li>

                        </ul>
                     </div>
<section id="Overview">          
<h3>OVERVIEW</h3>

谢谢

4

2 回答 2

1

犯“#subnav”的非常简单和容易的错误应该是“.subnav a”首先因为subnav是类,其次因为您希望点击绑定到链接

于 2013-05-31T12:04:30.420 回答
1

像这样的东西会起作用。0当没有 offset() 时,这将设置为顶部

$('.subnav li a').bind('click', function(e) {
    e.preventDefault();

    var hashTag = this.hash;
    var top = 0;

    if ($(hashTag).offset()) {
        top = $(hashTag).offset().top
    }

    $('html, body').animate({scrollTop:top}, 'slow');                                                         
});

这是更新:http ://bootply.com/62723

于 2013-05-31T12:11:20.920 回答