Получить координаты курсора

Ниже приведенная функция getPosition() получает текущие координаты курсора. Используя ее в разных jQuery событиях можно получить координаты клика или координаты курсора когда он находится над определенным элементом.

function getPosition(e){
	var x = y = 0;

	if (!e) {
		var e = window.event;
	}

	if (e.pageX || e.pageY){
		x = e.pageX;
		y = e.pageY;
	} else if (e.clientX || e.clientY){
		x = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;
		y = e.clientY + document.body.scrollTop + document.documentElement.scrollTop;
	}

	return {x: x, y: y}
}
JS

Использование

/* Координаты курсора */
$('body').mousemove(function(e){
	var coord = getPosition(e);
	$('#coord-live').html(coord.x + "," + coord.y);
});

/* Координаты клика */
$('body').click(function(e){
	var coord = getPosition(e);
	$('#coord-click').html(coord.x + "," + coord.y);
});
JS
01.02.2017 , обновлено 15.02.2020

Комментарии

, чтобы добавить комментарий.

Другие публикации

Кнопки прокрутки страницы вверх и вниз jQuery
Несколько примеров как сделать кнопки прокрутки страницы вверх и вниз. Для скроллинга используется jQuery функция...
13.06.2019
5935
+2
Select с ссылками
По спецификации HTML в option нельзя вставить ссылку, если все-таки её туда вставить, то работать она не будет. В таких случаях можно сделать перенаправление браузера по клику на JS или имитацию...
04.06.2020
557
0
Как сделать интерактивную схему на SVG + jQuery
В данном примере описано как сделать интерактивную схему магазинов на основе векторной графики SVG и jQuery.
06.11.2017
15300
+8
Работа с Textarea jQuery
Сборник jQuery приемов с textarea - получить содержимое, вставить значение, подсчет количества символов и строк и т.д.
04.03.2018
19698
+3
Манипуляции с элементами jQuery
Сборник методов jQuery для управления элементами DOM.
28.01.2020
1450
+2
Пример парсинга html-страницы на phpQuery
phpQuery – это удобный HTML парсер взявший за основу селекторы, фильтры и методы jQuery, которые позволяют...
18.03.2020
4093
+2