Question

我目前正在开展一个涉及制作动态网站的大学项目。我目前在我的网站上有一个部分是一个反馈表单，当按下按钮时，它会使用jQuery中的 slideDown（）函数向下滑动。

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

我可以得到任何帮助我会非常感激，因为我花了好几个小时试图找出问题而没有成功的结果。如果您需要更多信息，请询问我并不完全确定我可以将其放在此处，但此网站位于我的私人域名，我可以将其提供给人们实际查看该问题，谢谢

这是我实施的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并且可以正常使用。

＆＃13;

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

＆＃13;

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

＆＃13;

<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>

＆＃13;

jQuery动画故障

1 个答案: