使用jquery UI幻灯片制作周围动画

我正在尝试使用jquery和jquery ui来平滑地动画化一个从侧面滑出的div,并将另一个div滑出。我似乎只能让“另一个”div捕捉到新的宽度,但我似乎无法让它“滑动”到它。滑动div有动态元素,所以我不能硬编码。animate的值同时运行,除非有一种方法可以获得原始滑动元素在显示/隐藏后的宽度,常规jquery似乎有一个进度函数,你可以添加可以实现这一点的选项,但这在jquery ui(我用于幻灯片显示/隐藏)中被删除了。有什么建议吗?

我想做的事情:

HTML:

<div id='expander'>
    <!-- dynamically set -->
</div>
<div id='header'>
    <img src='placeholder.png' />
</div>

js:

$("#expander").show("slide",{direction: "left", progress: function() {
    $("#header").width($("body").width()-$("#expander").width());
}});

css:

#header {
    height: 100px;
    display:inline-block;
    background-color:red;
    padding-left:600px;
    float:right;
    width:100%;
}

#expander {
    width:fit-content;
    height:100%;
    background-color: #176087;
    display:inline-block;
    vertical-align:top;
    padding: 0px;
    margin-left:0px;
    z-index:1;
    min-width:fit-content;
}

它没有,因为show的幻灯片选项只在jQuery UI库中,而progress函数选项(调用每个tick)只在常规jQuery中(jQuery UI函数调用不支持它)。