Окружающий прямоугольник с высотой и абсолютными вращающимися элементами в Javascript

Question

У меня есть несколько элементов DIV (также могут быть изображениями) с абсолютным положением и повернуты и масштабируются с помощью CSS.

Как я могу вычислить общую ширину и высоту, что элемент оккупировать (прямоугольник вокруг тогда). Проверка offset() от position() не дает мне правильных результатов.

Мне нужно решение в Javascript/Jquery, если возможно, или математику, поэтому я могу рассчитать ее самостоятельно, если нет других вариантов. Благодарю.

Что я пробовал:

• использовать смещение, но это не дает мне правильную точку
• положение(), но она не принимает во внимание вращение

CSS А.Н. элементов, например:

position:absolute; 
-webkit-transform: rotate(-280deg); 
-webkit-transform-origin: 43px 33px; 

Answer 1

getBoundingClientRect() сможет предоставить вам положение и размеры каждого из ваших элементов после того, как к ним будут применены CSS transform.

Оттуда, это вопрос выяснить общую высоту (вычитая минимальную top от максимального bottom) и ширину (вычитая минимальную left от максимума `справа).

Here's a fiddle example и here's a semi-related question, который должен вас начать.