1

Имеется div размером 400х400рх, находится он в отступe от верхнего края 100рх.

   <div style="width: 400px; height: 400px; margin-top: 100px" id="box">
   </div>

Далее, хочу написать слежку за координатами нажатия мыши конкретно внутри div'a. Сделал следующее:

  <script>
  box.onclick = function() {
  alert (event.pageX+':'+event.pageY);
  }            
  </script>

Координаты отслеживает, выводит, но счёт начинается не с левого верхнего угла div'a, а именно с угла страницы, как исправить?

1 ответ 1

3

Надо отнять от координаты мышки с начала страницы координаты элемента.

Конечно, есть специальное свойство offsetX и offsetY, но они не кроссбраузерные.

box.onclick = function() {
  console.log((event.pageX - box.offsetLeft) + ':' + (event.pageY - box.offsetTop));
}
#box {
  margin: 100px;
  background-color: red;
  width: 400px;
  height: 400px;
}
<div id="box"></div>

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.