Есть блок, нужно получить координаты его угла, как можно это сделать?
1 ответ
const someBlock = document.querySelector('.some-block');
const rectSomeBlock = someBlock.getBoundingClientRect();
console.log('Координаты левого верхнего угла:' + 'x= ' + rectSomeBlock.x + ' | y= ' + rectSomeBlock.y);
console.log('Координаты левого нижнего угла:' + 'x= ' + rectSomeBlock.x + ' | y= ' + rectSomeBlock.bottom);
console.log('Координаты правого верхнего угла:' + 'x= ' + rectSomeBlock.right + ' | y= ' + rectSomeBlock.y);
console.log('Координаты правого нижнего угла:' + 'x= ' + rectSomeBlock.right + ' | y= ' + rectSomeBlock.bottom);
.some-block {
width: 150px;
height: 300px;
background-color: #eee;
border: 1px solid red;
/*Можете поочерёдно расскоментировать данные внешние отступы, чтобы просмотреть, как это работает*/
/*margin-left: 20px;*/
/*margin-top: 20px;*/
}
<div class="some-block">Какой-то блок</div>
https://developer.mozilla.org/ru/docs/Web/API/Element/getBoundingClientRect - а вот здесь более подробно почитать можно