jQuery UI：用幻灯片切换 - 下面的div与上面的div一起移动

Question

我有几个div，它们有headbar-div和content-div。当我点击我的切换符号时，content-div会以幻灯片效果切换（=消失），只有headbar-div仍在那里。 这很好用，但是在这个下面有很多div，当我最小化上面的div时，下面的div固定在他的旧位置，直到滑动效果结束。当幻灯片效果结束时，下面的div将直接传送到最近最小化的头条下。

我怎样才能完成它，较低的div滑动与最小化的div？ 我不知道它是否重要，但所有这些div都是可排序的（使用jQuery UI）。

然而，当我调整div（使用jQuery UI）高度时，div会立即移动。

我的代码

$( ".togglepanelcontent" ).click(function() {
    var icon = $( this );
    icon.closest( ".panelgroup" ).find( ".panelcontent" ).toggle("slide", {direction: "up", duration: "slow", easing: "easeOutQuart"});
});

div的行为方式

div应如何表现