jQuery Tabs 高度溢出了我的其他 div答案

【问题标题】：jQuery Tabs height is overflowing my other divsjQuery Tabs 高度溢出了我的其他 div
【发布时间】：2012-06-23 21:59:21
【问题描述】：

我正在寻找修复我的网站布局。这有点令人困惑，所以我希望我能解释得足够好。

这是我当前的代码。

<div class="allContent">
    <div class="contactDetailsRight backgroundTall">
       <div class="backgroundTop">
          <div id="contactTabs">

             <ul class="headTabs">
                 <li><a href="panel.php?a=1" title="Notes">Notes</a></li>
                 <li><a href="panel.php?a=2" title="Map">Map</a></li>              
             </ul>

             <div id="notes"></div>
             <div id="map"></div>

          </div>
       </div>
    </div>
</div>

我的代码的简单分解。父 div (contactDetailsRight) 是绝对定位的。 contactTabs 包含动态加载内容的 jQuery UI 选项卡，具有动态高度。

问题： .contactDetailsRight (Parent Div)，有背景图片和颜色，但是当标签的内容超出页面时，div背景/颜色停止。起初我虽然可以用我的'scrollheight'函数改变它，但这不起作用，因为滚动的实际div是（.allContent）

我不明白为什么我似乎无法获得合适的高度值。我已经尝试过这些以获得适当的高度：

<script type="text/javascript">
$(document).ready(function(){
   var h1 = $(".contentBoxRight").height();
   var h2 = $(".allContent").height();
   alert(h1 + h2);
});
</script>

任何想法将不胜感激。

【问题讨论】：

尝试 var h1 和 var h2 或者直接警告而不使用 vars
对不起，我忘了在那里添加 h1 + h2。 h1 给出 ViewPort... h2 给出 NULL。

标签： jquery css jquery-ui height overflow

【解决方案1】：

对于contactDetailsRight，如果有的话，从CSS中移除height属性，并添加一个css属性：overflow:auto

【讨论】：

【解决方案2】：

页面中没有 contentBoxRight 类。将其更改为contactDetailsRight 以获取其高度

   var h1 = $(".contactDetailsRight").height();
   var h2 = $(".allContent").height();
   alert(h1 + ', ' + h2);

http://jsfiddle.net/cKYbz/

【讨论】：