jQuery 动画故障

Question

我目前正在从事一个涉及制作动态网站的大学元素。我目前在我的网站上有一个部分是一个反馈表，当按下按钮时，它会使用 jQuery 中的 slideDown() 函数向下滑动。

我目前遇到的问题非常奇怪，是我以前从未见过的。基本上需要发生的是当按下“反馈”按钮时，名为“反馈”的文章应该向下滑动。发生的事情是当按下按钮时，它只是出现而不是平滑的动画，几乎就像它跳过动画一样。在此之后我开始调试网站，我注意到在后台动画正在运行但似乎没有出现？那么是什么原因造成的呢？

如果我能得到任何帮助，我将不胜感激，因为我花了数小时试图找出问题所在，但没有成功。如果您需要任何更多信息，请询问，我不完全确定我是否可以将它放在这里，但这个网站在我的私有(private)域中，我可以将其提供给人们以实际查看问题，谢谢

这是我实现的 jQuery 库:

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

这是绘制动画的脚本:

$('#nav-6').click(function(){
            $('.feedback').slideDown(2000);
        });

这是feedback.php

<article class="feedback">
<h1 class="filler-header">Feedback Form</h1>
<section>
    <form action="#" name="feedback">
        <p>Name: </p><input type="text" class="fb-field"/>
        <p>Email: </p><input type="text" class="fb-field"/>
        <p>Description: </p><input type="text" class="fb-field"/>
        <button type="submit" name="Submit" class="fb-button">Submit</button>
    </form>
</section>

最后是所有相关内容的 CSS:

.feedback {
width: 100%;
height: 350px;
background-color: #1e1e1e;
border-bottom: 1px solid #111;
position: relative;
display: none;
}

Answer 1

我使用的是 Chrome v38，它可以正常工作。

$('#nav-6').click(function(){
            $('.feedback').slideDown(2000);
 });

.feedback {
width: 100%;
height: 350px;
background-color: #eee;
border-bottom: 1px solid #111;
position: relative;
display: none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="nav-6">click me</button>
<article class="feedback">
<h1 class="filler-header">Feedback Form</h1>
<section>
    <form action="#" name="feedback">
        <p>Name: </p><input type="text" class="fb-field"/>
        <p>Email: </p><input type="text" class="fb-field"/>
        <p>Description: </p><input type="text" class="fb-field"/>
        <button type="submit" name="Submit" class="fb-button">Submit</button>
    </form>
</section>
</article>