CSS絕對定位的div高度

Question

我有我的HTML文檔的結構如下：

<div id="slideshow"></div> 
<div id="content"></div> 

$('#slideshow').css({ 
    'height' : $('#content').innerHeight()+'px' 
}) 

的#slideshow DIV定位絕對具有較低的z-index和＃內容的div相對定位高度設置爲自動。

問：如何確保幻燈片的高度也設置爲自動並根據內容的高度？

我甚至試過jQuery .innerheight()屬性沒有運氣。

Answer 1

如果你的內容可以（通過增加新的內容，或拖動在瀏覽器如Chrome瀏覽器的textarea例如）被dinamically調整，則應該包括jQuery的調整大小的插件，並且回調每當您的內容div被調整大小時觸發。如果您的內容可以調整大小的唯一方式是調整窗口大小，您不需要包含jquery resize，然後您應該將resize事件綁定到窗口對象$（window）.resize（.... ）;

如果您的內容無法以任何方式調整大小，那麼只需調用updateSize（）方法即可。您可以在以下鏈接中查看它，但我建議您在Chrome中檢查它並調整textarea的大小，以便測試幻燈片放映盒的更新方式。

http://jsfiddle.net/qFE6b/2/

var updateSize = function(){ 
    $('#slideshow').height($('#content').height() );  
}; 

$("#content").resize(updateSize); 


updateSize(); 

Answer 2

http://jsfiddle.net/jphellemons/qFE6b/

$('#slideshow').height($('#content').height()); 

Answer 3

這是最徹底的方法：

http://jsfiddle.net/peduarte/zTATa/