How to get the mouse positions dynamically using jQuery ?

Getting mouse positions in jQuery


event.pageX and even.pageY properties are used to get the positions of the mouse pointer relative to the left and top edge of the document respectively when mouse is moving.

Example jQuery code to get current mouse position

      <title>The jQuery Example</title>

      <script src=""></script>		
      <script type = "text/javascript">
      $(document).ready(function() {
        $(document).mousemove(function(event) {
          var x = event.pageX;
          var y = event.pageY;
          $('span').text("Current position X: " + x+ ", Current position Y: "+y);
          $('span').css('color', 'blue');

   <p>Test Section</p>
<p>Please click any where in the page to get the mouse position X and Y: <span></span></p>
mouse positions output

event.pageX - returns the X coordinate relative to the left edge of the document.

event.pageY - returns the Y coordinate relative to the top edge of the document.

Privacy Policy  |  Copyrightcopyright symbol2020 - All Rights Reserved.  |  Contact us   |  Report website issues in Github   |  Facebook page   |  Google+ page

Email Facebook Google LinkedIn Twitter