如何让bootstrap3手风琴平滑滚动到浏览器顶部？

Question

我一直试图让它顺利运作，问题是当点击手风琴面板时，它似乎只是“跳”到屏幕顶部而不滚动。

沙龙页面滚动位完美无缺

$(document).ready(function(){

    // staff page scrolling     
    $('a.staff').click(function(){

        //$("html, body").scrollTop($(this).position().top);

        var el = $(this).attr('href');

        var elWrapped = $(el);

        scrollToDiv(elWrapped,50);

        return false;

    });


    // salon page scrolling 
    $('li.subnav a').click(function(){

        // set active states
        var parent = $(this).parent();

        siblings = parent.siblings(),

        isOn = parent.toggleClass('active').hasClass('active');

        siblings.toggleClass('active', !isOn);

        // get element and offset
        var el = $(this).attr('href');

        var elWrapped = $(el);

        scrollToDiv(elWrapped,175);

        return false;

    });

    // scroll to accordion element 
    function scrollToDiv(element,navheight){

        var offset = element.offset();

        var offsetTop = offset.top;

        var totalScroll = offsetTop-navheight;

        $('body,html').animate({

                scrollTop: totalScroll

        }, 800);

    }

});

以下是应该滑动的面板

<div class="panel panel-default">
    <a data-toggle="collapse" data-parent="#accordion-data-parent-001, #accordion-data-parent-002" href="#collapse-[[+id]]" class="staff">
      <div class="panel-heading" >
          <div class="row">
              <div class="col-sm-3">[[+tv.headshot]]</div>
              <div class="col-sm-9">
                  <h4 class="panel-title">[[+pagetitle]]</h4>
                  <p>[[+introtext]]</p>
              </div>
          </div>
      </div>
  </a>
  <div id="collapse-[[+id]]" class="panel-collapse collapse">
    <div class="panel-body">[[+content]]</div>
  </div>
</div>

我做错了什么？