Узнать координаты мыши в jQuery можно, хотя это и достаточно редкая задача. Например, я использовал этот метод для рисования выделенных объектов через map area.
jQuery позволяет не только узнать текущие координаты объекта, но даже изменить их. Для этого мы будем использовать такие методы как page и offset.
Начнем с простого - узнаем координаты перемещения мыши по всему документу (html):
$("html").mousemove(function (pos) {
$("#p1").html('Абсолютные координаты: По оси X:'+pos.pageX+', По оси Y:'+pos.pageY);
});
<p id="p1"></p>
Теперь ведя мышку из стороны в сторону будет срабатывать событие mousemove, которое запишет в #p1 всегда новые значения X и Y страницы. Заметьте здесь используется pos.pageX и pos.pageY.
А что если нам нужно узнать координаты только внутри какого-то элемента? Тогда нужно использовать offset. Простой пример:
$("#demo-box").mousemove(function (pos) {
$("#p2").html('Относительные координаты: По оси X:'+pos.offsetX+', По оси Y:'+pos.offsetY);
});
<p id="p2"></p>
Работает также, как и в первом примере, только отсчет берет с левого верхнего угла объекта.
Чтобы найти координаты левого верхнего угла любого объекта используйте данный код:
var offset = $("#demo-box1").offset();
$("#p3").html('Координаты по верхнему левому краю элемента относительно всей страницы: По оси X:'+offset.left+', По оси Y:'+offset.top);
<p id="p3"></p>
И, напоследок, рассмотрим пример, который позволит изменить координаты любого элемента. Например, при наведении на него мыши. Делается это так:
//Установить новые значения координат
$("#demo-box2").mousemove(function (pos) {
$("#demo-box2").offset({top:57, left:500})
});
<div id="demo-box2">Изменить координаты</div>
Т.е. когда мы наводим мышь на #demo-box2, ему задаются новые координаты левого верхнего угла и он перемещается к ним.
Теперь зная данные методы определения координат на странице, можно смело делать различные условия, вплоть до того, что если пользователь наведет мышь на какой-то элемент внутри объекта, он автоматически будет переадресован или появится всплывайка.
