CSS绝对定位的div高度

Question

我的HTML文档具有以下结构：

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

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

#slideshow div绝对定位，z索引较低，而#content div相对定位，高度设置为auto。

问题：如何确保将幻灯片放映的高度也设置为自动，并根据内容的高度？

我什.innerheight()没有运气就尝试过jQuery .innerheight()属性。

Answer 1

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

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

Answer 2

如果您的内容可以动态调整大小（例如，通过添加新内容，或在诸如Chrome之类的浏览器中拖动文本区域），则应包括jquery resize插件，以及在调整内容div大小时触发的回调。

如果可以调整内容大小的唯一方法是在窗口调整大小中，则不需要包括jquery调整大小，然后应将resize事件绑定到窗口对象$（window）.resize（....）;。

如果您的内容无法以任何方式调整大小，则只需调用updateSize（）方法即可。 您可以在以下链接中进行检查，但我建议您在Chrome中进行检查并调整文本区域的大小，以便测试幻灯片框的更新方式。

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

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

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


updateSize ();

Answer 3

这是最干净的方法：

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