Почему getBoundingClientRect считает не правильно высоту?

Question

[Максим]

Делаю аккордион с плавным изменением высоты от 50 до не известной, получаю высоту в переменную
h = el.getBoundingClientRect().height и присваиваю эту высоту родителю но не работает ? Высота присваивается но не вся ..почему то ...где я ошибся ?

Как мне убрать 70 из let h = parent.querySelector(".hidden").getBoundingClientRect().height + 70; ?

Код здесь: https://codepen.io/topicstarter/pen/NWdKGzr

Answer 1

[Юрий]

Вы родителю .item присваиваете высоту .hidden. Там ещё label рядом лежит, у которого своя высота есть + бордер + маргин. Замените 70 в расчёте h на высоту лейбла + его нижний маргин, и логика будет правильной. А ещё лучше просто сделайте так: let h = parent.scrollHeight;

Answer 2

[Павел]

Скрытые элементы браузер не рендерит, поэтому размер у такого элементы не узнать.
У вас не вся высота - видимо потому, что в момент работы getBoundingClientRect() - элемент виден именно на столько...

Решение зависит от конкретной ситуации.
Я обычно позиционирую элемент абсолютно за экраном - меряю его высоту, и возвращаю на место...

Comments

[Максим]

хиден не срытый у меня