CSS-преобразование вращается вокруг центра элемента; Я понимаю, что вы хотите переместить элемент так, чтобы он вращался вокруг другой точки. Естественный способ сделать это - трансформация, но вы говорите, что не хотите этого делать - я полагаю, у вас есть веская причина.
Что вам нужно сделать, так это сместить положение элемента на величину, на которую переместился бы его центр, если повернуть вокруг этой точки . Поэтому:
- Пусть точка p = половина ширины и высоты элемента (используя
getComputedStyle
, если необходимо).
- p = p - точка начала вращения.
- p = rotate ( p , angle ) (где
rotate
- это (ошибочно названо, поскольку оно не вращается о точке, но происхождение) функция в вашем коде).
- p = p + точка начала вращения
- p = p - половинные размеры элемента.
p теперь содержит значения, назначаемые сверху / слева. Обратите внимание, что шаги 2 - 4 являются обычной процедурой вращения вокруг точки, отличной от начала координат; шаги 1 и 5 просто смещаются от исходного значения преобразования по умолчанию и обратно.
Если это , а не , что вы ищете, тогда, пожалуйста, предоставьте диаграмму, показывающую желаемые результаты.