手风琴效果重叠问题

Question

我认为这可能是CSS的问题，但我不是很确定。

问题:我有一个当单击父div时会展开的div，它使用jQuery/CSS实现这一点。当它展开时，它与页面上的页脚重叠。我想让页面在高度上扩展，以适应新的内容，而不会重叠页脚。因此，基本上页脚应该移到一边。有什么想法吗？

下面是一些代码。

HTML：

<div id="wrapper">
  <div id="virtualtours">
    <span id="virtualtours_title">VIRTUAL TOURS</span>
    <div id="virtualtours_videos">
      <?php include'inc.virtualTours.php'; ?>
    </div>
  </div>
</div>
<div id="footer">...</div>

jQuery：

$("#virtualtours").click(function(){

        if( $("#virtualtours_videos").css("height") == "0px" ){
                $("#virtualtours_videos").css("height","240px");
        } else { $("#virtualtours_videos").css("height","0px"); }
});

在CSS中，一切都是相对定位的。

position:relative;

Answer 1

如果你检查jQuery Accordion，你会看到，每个部分都有静态高度。在你的例子中，更好的方法是将高度值严格赋值给#wrapper。此外，每个部分都有相同的高度，所以对于页面设计来说，这应该不是问题。