Get the actual left, top position of the rotated div

If I have a div that is rotated 45 degrees, and its attributes are: left: 0, top: 0, width: 100px, height: 100px. Is it possible to get the actual x, y position of the upper left corner of the divs?

When the div is rotated, the upper left corner is approximately -10px, -10px (guess). But I'm trying to calculate the actual top left x, y corners for a web application.

Maybe you know a mathematical formula that can determine the upper left corners of x, y position? Or maybe the javascript attribute will give me this? For example, div.style.actualLeft ;?

+5
source share
1 answer

45 , , :

sqrt((width/2)^2+(height/2)^2)
sqrt(50^2+50^2) // Pythagorean theorem

70,71067811865475

, , x 70,7106... y 0.

, , ! !

, sqrt(50^2+50^2), , + 135 ( ). (90 = , + 45 = 135)

, , , :

var dist=Math.sqrt(50^2+50^2);
var degtorad=Math.PI/180;

var x = Math.cos(degtorad * (135+rotation)) * dist;
var y = Math.sin(degtorad * (135+rotation)) * dist;

x y . , , , .

:

rotation=45
135+45 = 180

Math.cos(degtorad * 180)) = -1
Math.sin(degtorad * 180)) = 0;

x = -1 * dist = -70,71067811865475
y = 0 * dist = 0

, , , cos/sin.. . (-75 )

+7

All Articles