Question

我将持续时间增加到2000，以准确地向您展示我在说什么。单击关闭（X）时，动画不是人们称之为slideUp的动画。我原以为表格会向上移动直到它完全消失。相反，它慢慢地从底部到顶部隐藏。

预计slideUp的行为是否正常？或者这是我做过的事情？

我猜它是因为这部分CSS（第15行）

.js-enabled form {
    position: absolute;
    top: -21px;
    display: none;
}

Answer 1

即使slideDown下有config，您在fadeIn下使用的是init。我还将2000ms（2秒）更改为500ms（1/2秒）。小提琴：http://jsfiddle.net/dj2Y8/3/

jQuery slideUp基本上将元素的height动画为0px并隐藏它;是的，它正在发挥作用。

Answer 2

这是.slideUp()的正常行为。来自the doco：

.slideUp()方法可以设置匹配元素的高度。这会导致页面的下半部分向上滑动，似乎隐藏了这些项目。

或者换言之，隐藏的元素下方的元素似乎向上滑动。但在你的情况下，因为你有position:absolute;，下面的元素比幻灯片更具有“揭示”效果。

如果您使用.animate() method更改元素的top，则可以让元素本身实际滑动：

.animate({top : -$this.height()-100}, 2000)

演示：http://jsfiddle.net/dj2Y8/4/

出于演示的目的，我只是简单地将top设置为足够负面的位置，使其从窗口顶部移开，当元素位于页面顶部时很容易-$this.height()不够高，所以我随意减去额外的100。显然，如果元素不在页面的顶部，你可能需要调整它，也许一次动画几个CSS属性。

表单上的幻灯片不按预期工作

2 个答案: