Jquery 滑动切换会留下空白

所以我正忙于这个项目，其中包括一个横幅，点击按钮可以上下滑动：

 $("#open").click(function() {
    $("#banner").slideToggle("slow");
  });

如您所见，每当单击“打开”按钮时，横幅都会根据其当前状态向上或向下滑动

但当横幅向上滑动时，会创建一个空白区域，如示例1所示：

当显示横幅时，剩下的空间很小，这就是我想要的效果，如示例2所示：

“parkbench”是横幅的底部，但如果我截屏完整的图片，这篇文章会很长

现在，我想要实现的是，两个项目之间的空间保持不变，所以当横幅未显示时也是如此

HTML非常简单：

    <div id="banner">
            <div id="djbanner"></div>
        </div>



<div style="float:left; margin-left:0.55%; margin-top:210px; width:42%">
<div class="vak">
    <div class="vak_top"><p class="text">Box</p></div>
    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean imperdiet. Etiam ultricies nisi vel augue. Curabitur ullamcorper ultricies nisi. Nam eget dui.

Etiam rhoncus. Maecenas tempus, tellus eget condimentum rhoncus, 
</div>

我知道有一个分区没有关闭，但那是因为它下面还有另一个分区，这对于这个问题来说并不必要

有没有办法达到我想要达到的效果

谢谢

---

Rob

看起来额外的空间似乎是由它下面的div布局和大边距顶部设置造成的。最快的修复方法是在使用slideToggle调用的相同JS函数中更改边距顶部，但理想情况下，您希望消除浮动和大边距顶部，并找到一种使用常规页面流实现布局的方法。

我使用以下方法解决了此问题：

 if ($('#banner').css("display") == "none") {
    $("#banner").slideDown(2100);
    $("#contentmain").animate({marginTop: '-329px'}, 1500);
 } else {
        $("#banner").slideUp(2100);
        $('#contentmain').animate({marginTop: '-480px'}, 1500);
    }
});

---

斯蒂尔，谢谢你的回答

演示将是有用的，但这可能是由于您的利润率最高，