Twitter Bootstrap 触发折叠元素在固定导航栏下向上滚动

Question

我在页面顶部有经典的固定导航栏菜单。 （直接取自 Bootstrap 示例页面上的基本示例） 我希望有一个菜单选项，一旦单击，就会显示一个折叠元素，从而使页面向下移动以便为该元素腾出位置。

它现在有点工作，但它有一个奇怪的行为。 每当我单击菜单选项时，折叠元素确实会显示，向下滑动页面的其余部分，但它会以某种方式将自己置于屏幕顶部，位于导航栏后面。 我不知道如何让它从导航栏的底部向下滑动。 很难解释，所以这里是 the link to the page，然后单击 CONTACT 以查看它的作用。 注意滚动条，看起来元素位于正确的位置，但它会强制向上滚动，因此元素的顶部位于导航栏下方的屏幕顶部。

这是我正在使用的 HTML 代码的一部分：

这个是需要展示的折叠元素：

<div class="wrapper">
    <div class="row-fluid centerSpan ">
        <form id="contact" class="form-horizontal collapse">
            <fieldset>

这个是崩溃的呼唤（最后一个<li>）：

<ul class="nav">
    <li class="active"><a href="#">Acceuil</a></li>
    <li><a href="#about">CV</a></li>
    <li data-toggle="collapse" data-target="#contact"><a href="#contact">Contact</a></li>
</ul>

Answer 1

我不知道为什么崩溃会这样，但我只是做了一个简单的处理程序来使用slideToggle() 显示表单，我在您的网站上对其进行了测试并且运行良好

$('.nav [data-toggle="collapse"]').click(function(e){
    e.preventDefault();
    $(this).data('target').slideToggle();
});