当位置的高度：绝对子div增加时展开父div div

我有一个父div和2个子div。当位置的高度：绝对子div增加时展开父div div

<div id="parent"> 
    <div class="child1 col-2"></div> 
    <div class="child2 col-10"></div> 
</div>

的child1绝对定位，并包含可折叠的项目。当我在child1中展开可折叠物品时，其高度会增加。如何增加家长的高度 DIV和/或的child2 DIV时的页面后child1的高度增加，已加载？

来源

2014-04-10 melvindidit

绝对定位在页面流删除项，删除此定位解决您的问题。你的问题需要更多的背景。为什么** child1 **绝对定位，你的目标和约束是什么？ – gingerbreadboy

[为什么绝对定位的父级工作中的百分比宽度子项不可能重复]（http://stackoverflow.com/questions/6/why-doesnt-the-percentage-width-child-in-absolutely-positioned-父母工作） –

我已经使用子1作为绝对定位，因为它已被添加到项目的常见元素（python/django模板）。页面加载后，根据子页面1的高度变化，有什么方法可以增加子页面2的高度？ – melvindidit

你的第一个孩子（child1）的位置是绝对的，你需要计算的第一个div的高度和分配顶部值第二个div

DEMO

HTML

<div id="parent"> 
    <div class="child1 col-2">Child1<br/>test1 
     <a class="collapse" href="#">collapse</a> 
     <div class="insideDiv"> 
      test inside 
     </div> 
    </div> 
    <div class="child2 col-10">Child2</div> 
</div>

CSS

.child1 { 
    position:absolute; 
} 
.child2 { 
    position:relative; 
} 
.insideDiv { 
    display:none; 
}

jQuery的

var child1Height = $(".child1").height(); 
$(".child2").css('top' , child1Height); 

$(".child1 .collapse").click(function(){ 
    $(".insideDiv").slideDown(function(){   
     var countHeight = $(".child1").height(); 
     $(".child2").css('top' , countHeight);  
    }); 
})

来源

2014-04-10 12:33:22 Santy

当位置的高度：绝对子div增加时展开父div div

回答

相关问题