JavaScript
Article
By Sam Deering

jQuery Get Relative Mouse Position

By Sam Deering

jQuery code snippet to get the relative position of the mouse pointer. The function takes in the element id as a parameter and the current x and y co-ordinates of the mouse pointer. It then returns the relative distances between the mouse’s cursors current position and the specified element.

function rPosition(elementID, mouseX, mouseY) {
  var offset = $('#'+elementID).offset();
  var x = mouseX - offset.left;
  var y = mouseY - offset.top;
  return {'x': x, 'y': y};
}

--ADVERTISEMENT--

Example Usage

jQuery(document).ready(function($) {

	//get the current x and y of the mouse pointer
	var X = $('body').offset().left;
	var Y = $('body').offset().top;
	mouseX = ev.pageX - X;
	mouseY = ev.pageY - Y;
	
	//get the relative position to the #eid element on the page
	alert(rPosition('eid',x,y));

});
Recommended
Sponsors
The most important and interesting stories in tech. Straight to your inbox, daily. Get Versioning.
Login or Create Account to Comment
Login Create Account