Bootstrap 手风琴滚动到活动面板标题的顶部

我正在寻找一个代码，该代码可以滚动到我的 bootstrap 3 html/css 手风琴当前活动面板标题的顶部。我在 stackoverflow 上找到的最接近的解决方案是下面的 js 片段。

该代码片段工作得相当好，但是当单击面板标题时，页面会滚动，使得面板内容的最顶部与屏幕顶部齐平。有没有办法修改它，以便滚动效果将导致面板“标题”（而不是面板内容区域的顶部）在屏幕顶部可见？

    $(function () {
    $('#accordion').on('shown.bs.collapse', function (e) {
    var offset = $('.panel.panel-default > .panel-collapse.in').offset();
    if(offset)$('html,body').scrollTop(offset.top); }); });

让我知道我是否也应该分享 bootstrap 手风琴 html。

我用过这个，效果很好，如果你需要向上或向下调整一点，你可以在 .offset().top 之后调整 -20 。

$(function () {
    $('#accordion').on('shown.bs.collapse', function (e) {
        var offset = $('.panel.panel-default > .panel-collapse.in').offset();
        if(offset) {
            $('html,body').animate({
                scrollTop: $('.panel-title a').offset().top -20
            }, 500); 
        }
    }); 
});