javascript - jQueryUI : animate parent element height on child animation

Question

当我使用 jQuery UI .hide('slide', {direction:'up'}) 动画隐藏子元素时，我也想为其父元素的高度设置动画。

Here是我所拥有的一个例子。动画看起来不太好，因为父级的高度在子级隐藏后立即更改，而不是像 jQuery .slideUp() 动画那样在一个过程中更改。

Answer 1

我很快改变了你的CSS，如下所示，它看起来很不错。稍微搞一下，它应该看起来就像你想要的那样。

#container{
    width:100px;
    padding:10px;
    text-align:center;
    height:auto;
}

#child{
    background-color:blue;
    border:10px solid #red;
    border-top:0px;
}

#content{
    background-color:red;
}