假设我有
CSS:
.mainWrap { position: relative; overflow: hidden; }
.wrap-boxes { positon: relative; }
.box { position:absolute (position and height is generated by plugin isotope: http://isotope.metafizzy.co/custom-layout-modes/centered-masonry.html }
HTML:
<div class"mainWrap">
<div class="wrap-boxes">
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
</div>
</div>
应用于包装盒的 clearfix 将不起作用,因为其中包含具有绝对位置的元素。
因此我需要使用 jQuery 来计算框的高度以扩展 wrap-box。我不知道这些盒子的高度,因为它们的高度是随机的,而且我不知道盒子的总数,因为它们是由客户不断生成的。我需要一个通用的 jQuery 来解决这个问题。如果我不扩展 mainWrap,盒子将被切断,我需要使用 overflow: hidden 出于其他原因。
有什么帮助吗?
最佳答案
也许是这样的?
$.fn.wrapHeight = function() {
return this.each(function() {
var height = 0;
$(this).children().each(function() {
height += $(this).height();
}).end().height(height);
});
};
$('.wrap-boxes').wrapHeight();
关于javascript - 当容器中有绝对定位的元素时如何扩展容器?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9164309/