ScrollTo（）函数无法与部分正常工作

Question

我有刚刚完成开发的应用程序的一系列部分。 我正在使用jQuery的scrollTo插件。 过去对我来说一直很好。

该应用程序应该执行以下操作：

1. 所有部分均加载，并且第一部分立即展开，其他所有部分均保持折叠状态（此方法有效）
2. 您可以单击另一部分，当前打开的部分将折叠，单击的部分将展开（此方法有效）
3. 扩展完成后，窗口将滚动到扩展部分的顶部（此功能无效）

我需要那里第三步的帮助。 我的代码如下。

我已经在scrollTo（）插件和ScrollTop的用法上搜索了各种主题。 我都尝试过，但是什么都没有改变。

我想知道调用切换功能时是否与它有关，但我不确定。

我真的很希望在这里找到答案。 如果您需要进一步的说明或代码，请告诉我！

    //module expansion and contraction
$('.module-heading').click(function(){
    var id = $(this).attr('id');

    var data = $(this).data('toggle');
    $('.app-section').each(function(){
        if($(this).is(':visible')){
            $(this).toggle('slow');
        }
    })
    $(data).toggle('slow', function(){
        $(id).scrollTo(100);    
    });
});

这也是示例HTML

<div class='row module-heading module-heading-plain' data-toggle='#questionaire'>
    <div class='form-group'>
        <div class='col-md-12'>
            <h4 class='text-info'>
                Pre-Application Questionaire
            </h4>
        </div>
    </div>                  
</div>
<span id='questionaire'>
       <!-- form goes here -->
</span>

这是小提琴的链接http://jsfiddle.net/5q48n0z1/4/

Answer 1

似乎您想将正文滚动到新部分。 因此，我们需要以html / body为目标（ fiddle ）：

$('.module-heading').click(function(){

    var $this = $(this);

    $('.app-section:visible').hide("slow");

    $($this.data('toggle')).show('slow', function(){
        $("html,body").animate({
            scrollTop: $this.offset().top   
        }); 
    });

});

_{注意：您需要具有溢出内容才能滚动正文。 您可能会考虑在主体上添加一些填充。}