jQuery Tracking The Position Of The User's Mouse

You would want to use the "pageX" and "pageY" methods. For example, let's say that we had a single paragraph tag in our document. If we wanted the paragraph tag's text to dynamically display the coordinates of the user's mouse, we could do the following:

$(document).ready(function()
 {
  $().mousemove(function(e)
   {
    $('p').html("X Axis : " + e.pageX + " | Y Axis " + e.pageY);
  });
});

View The Example

This code says the following - When the document is ready to be manipulated, we'll listen for when the user moves his or her mouse (mousemove). When it does, we'll set the html of our paragraph tag to display the coordinates (e.pageX and e.pageY, respectively).

Jeffrey Way is a freelance web developer based in Nashville, TN. When not losing his sanity staring at his computer, he enjoys spending time with his family and beautiful fiance. Jeffrey is a DZone MVB and is not an employee of DZone and has posted 3 posts at DZone. You can read more from them at their website.