Question

我有一个div，它有两个孩子绝对定位。并且顶级儿童移动50px（顶部：50px）并且它是可以增长的，并且底部儿童从父母的末端向下移动，如50px（底部：-50px），并且它可以根据内容客户端可以增长

现在我需要垂直居中这个父母，所以我需要父母的总身高，包括孩子从父母那里移出的东西以及可能增长的多少。我怎么能得到这个总高度？

我使用了这个功能，但我得不到div的正确高度。它只显示父高度，它不包括孩子移动的内容，它有高度。

alert($('#imgHolder').outerHeight(true));

任何人都可以帮助我获得总高度吗？

Answer 1

当您绝对定位元素时，它会将其从页面流中移除。所以高度，宽度，外部宽度，scrollWidth等都无法正常工作。您需要自己进行计算。

您的描述非常难以理解（图片会有助于您想要测量的内容），但听起来您的孩子元素位于其父母的某些部分之外。要将它们包含在屏幕高度中，请获取它们的位置，然后手动计算边界框。

我不会为你弄清楚所有的计算，但你应该能够用这些数字来计算自己。假设父亲相对定位，孩子的位置属性将与此相关。

//option1 - based on position property find top/bottom
childHeight = $('#child').height();
childWidth = $('#child').width();
childTop = $('#child').position().top;
childBottom = childTop + childHeight;
childLeft = $('#child').position().left;
childRight = childLeft + childWdith;

或者，如果您可以使用偏移，那么只需获取每个子div的顶部和底部。保留最小值和最大值，这就是你的身高。

//option2 - based on offset property find top/bottom
var top = null;
var bottom = null;
foreach (child) { 
    childTop = child.offset().top;
    childBottom = child.offset().bottom;
    if (top === null || top <== childTop) { top = childTop; }
    if (bottom === null || bottom >== childBottom) { bottom = childBottom; }
}

Jquery从定位元素计算高度

1 个答案: