0

我有一个重复的 div 容器 class="content" ，其中包含绝对定位的 div。

.content{
   width: 960px;
   margin: 0 auto;
   padding-bottom: 20px;
   position: relative;
   overflow: auto;
}

 .article0{
   width: 300px;
   position: absolute;
}

 .article1{
   width: 230px;
   position: absolute;
   top: 80px;
}

 .article2{
   width: 230px;
   position: absolute;
}

 .article3{
   width: 230px;
   position: absolute;
   margin-bottom: 20px;
   top: 500px;
}

如前所述，容器 class="content" 在同一页面中重复多次：

<div class="content">
<div class="article1"></div>
<div class="article2"></div>
<div class="article3"></div>
</div>

我想要做的是给容器在每个容器中最后一个孩子的高度和顶部位置，类为.content。我已经尝试了下面的代码，但没有任何结果，容器始终只获得相同的高度值，我猜只能来自最后一个或第一个容器的最后一个孩子？想不通！

$(function(){
var $box = $('.content');
var lastChildPos = $(':last-child', $box).position().top;
var lastChildHeight = $(':last-child', $box).height();

$box.height(lastChildPos + lastChildHeight);

});
4

1 回答 1

1

enter code here如果有多个实例，您将需要这样的东西：

$('.content').each(function(){

    var lastChildPos = $(':last-child', $(this)).position().top;
    var lastChildHeight = $(':last-child', $(this)).height();

    $(this).height(lastChildPos + lastChildHeight);

});

这样，它将它应用于盒子的每个实例，并$(this)获取与每个容器相关的变量。

注意： :last-child 将选择父容器中类型的最后一个子项。也许您想尝试：

var lastChildPos = $(this).find('div:last-child').position().top;
于 2012-10-24T14:05:53.823 回答