getBoundingClientRect()内部溢出:滚动

Question

我想使用getBoundingClientRect()计算元素的实际大小。如果元素位于具有给定大小和overflow:scroll的容器中，则该方法的结果有所不同。

小提琴

怎样才能始终得到元素的总大小，无论是否在溢出:滚动上下文中？

Answer 1

高度总是正确地返回，所以我相信它的宽度是你所关心的。在这种情况下，你的小提琴是给你适当的大小的元素。以下是如何-

记住规则-除非指定，元素的宽度将是父元素的100%。

使用“默认溢出”设置，您不会设置父包装器的宽度，因此，根据规则，父容器的100%宽度(向上的链将是窗口宽度)。

使用“溢出隐藏”和“滚动”，您将向包装器div添加一个“小”类，该类的固定高度和宽度为200 of。因此，再次应用该规则，它的宽度将是父级的100%，现在是200 So。