jquery - 具有推送效果的滑动联系表单使用 jQuery UI 保留页面内容的向下滑动

Question

我正在使用以下内容使用 jQuery 向下滑动联系表单：

$("#panel").slideDown(1000);

这里发生的是页面的其余内容向下滑动以容纳联系表格，这是我想要的，而不是“推送”联系表格到页面上，这样表格底部首先显示，它“显示”了表格，因此顶部首先显示。我想要“推送”效果，从这里搜索看来，包括 jQuery UI 和以下内容就可以了。

$("#panel").show("slide", { direction: "up" }, 1000);

它确实如此。但是，现在页面的其余内容并没有随着表单向下滑动，而是突然跳到正确的位置以容纳表单。

如何实现这两种效果，即向下“推”表单和向下滑动页面内容？

HTML

<div id="panel">

<div id="contact-form">

*FORM*

</div></div>

CSS

#panel {
    display:none;
}

#contact-form {
    width: 840px;
    height:auto;
    position:relative;
    left:50%;
    margin-left:-420px;
}