Какие свойства могут повлиять на позицию getBoundingClientRect элемента HTML блока? - PullRequest
0 голосов
/ 01 мая 2020

Вопрос : Каковы все свойства, которые могут складываться для смещения getBoundingClientRect элемента блока *1003* от смещения, заданного translate()?

Context : я работаю над сложным веб-приложением для создания контента с панелью просмотра. Пользователи могут щелкать и перетаскивать, чтобы панорамировать область просмотра, и могут нажимать кнопки боковой панели, чтобы анимировать область просмотра, перемещаясь в указанное положение c. #viewport - это вложенный div без каких-либо специальных правил позиционирования, и он является потомком root -уровня overflow: hidden div, который имеет width: 100vw; height: 100vh;. Поведение панорамирования #viewport реализовано с помощью translate() и анимировано с помощью свойства transition CSS.

Эта установка работала хорошо, и большую часть времени x, y смещение, указанное translate точно соответствует абсолютному окну просмотра x, y координаты, возвращаемые https://developer.mozilla.org/en-US/docs/Web/API/Element/getBoundingClientRect.

Однако в редких случаях я не смог для эффективного воспроизведения, getBoundingClientRect возвращает значения, которые не совпадают со значениями translate, которые я предоставляю, а #viewport смещен относительно того, где он должен быть на дельту между значениями translate и getBoundingClientRect значения. Мне не удалось определить какие-либо конкретные c свойства, которые могли бы создать это смещение, поэтому я хотел бы получить список потенциальных виновников. Я знаю, что все его родительские элементы имеют getBoundingClientRect x=0, y=0.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...