Мне нужно получить фактическую высоту нескольких разных элементов (для точного пользовательского позиционирования подсказки), и некоторые из этих элементов (не все) вращаются. $(elem).outerHeight() возвращает исходную высоту, а не фактическую отображаемую высоту.
Здесь скрипка с очень простым примером: http://jsfiddle.net/NPC42/nhJHE/
Я вижу возможное решение в этом ответе: qaru.site/info/478755/..., но я все еще надеюсь, что есть более простой способ.
Извлекая мою геометрию средней школы и мои грозные навыки графики, я поставил эту диаграмму вместе. Если у вас есть переменные width, height и rotation в javascript, вы можете выразить высоту следующим образом:
var rotated_height = width * Math.sin(rotation) + height * Math.cos(rotation);
Если вы будете использовать только вращение на 45 градусов, а ширина и высота всегда равны, вы можете рассчитать фактическую повернутую высоту, используя относительно простой математический Hypotenuse:
который утверждает, что квадрат длины гипотенузы равен сумме квадратов длин двух других сторон.
В этом случае самая длинная сторона будет диагональю от угла к противоположному углу. Это примерно преобразуется в jQuery так:
Math.sqrt(Math.pow($('#diamond').height(), 2) + Math.pow($('#diamond').width(), 2))
См. обновленный jsFiddle.