2013-02-22 51 views
1

我有一个评论列表,其中包含绝对定位的div中的内容。这是设计的一部分。它们位于弹出框中,该框设置为显示:无,然后使用单击事件淡入。找到绝对定位的子元素的高度并将其高度设置为其父亲

我遇到的问题是我需要获取内部绝对内容的高度并将该高度设置为其父级,并且似乎无法使其工作。每个项目可以是任意长度,因为它们是评论。

我在这里做了一个小提琴来展示我有什么样的结构。 http://jsfiddle.net/ZTDyA/

这是结构

<div class="hidden"> 
    <ul class="list"> 
     <li> 
      <div class="inner">there is some content here</div> 
      <div class="base">This is a div under the .inner div</div> 
     </li> 
     <li> 
      <div class="inner">For the thing I have made this has to be positioned absolutely, but the content could be of any length so I need the parent to each of these inners to be set to the height of the inner div.</div> 
      <div class="base">This is a div under the .inner div</div> 
     </li> 
    </ul> 
</div> 
+0

为什么你就不能删除'位置? http://jsfiddle.net/dfsq/ZTDyA/2/ – dfsq 2013-02-22 13:33:32

+0

由于设计原因,评论必须位于悬停时可见的另一图层之上。 – 2013-02-22 13:34:59

回答

2

当然,你可以做这样的事情:

$('.list li').each(function() { 
    $(this).height($('.inner', this).height()); 
}); 

的jsfiddle:http://jsfiddle.net/ZTDyA/1/

我不明白的是为什么它绝对定位。如果有的话,你可能想要定位李的绝对。也许如果你详细说明,我们可以提供更好的解决方案。像这样设置高度(通过js)是不好的练习。

+0

这一切都与这个评论区的设计有关,基本上我有一个div位于悬停时显示的评论内容之下。这完全解决了它,谢谢你。 – 2013-02-22 13:39:24

0

检查:从`.inner` absolute`:

$('button').on('click', function() {  
var hei= $('.inner').height(); 
$('.inner').closest('li').height(hei); 
}); 
相关问题