當位置的高度：絕對子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

回答

相關問題