Track Mouse Position In jQuery - Coords.js

Track Mouse Position In jQuery - Coords.js
File Size: 2.33 KB
Views Total: 148
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   

Coords.js is a tiny jQuery script that tracks mouse movement events and gets the current cursor position (horizontal and vertical coordinates) relative to Window using the JavaScript MouseEvent API.

See Also:

How to use it:

1. The script requires jQuery library to keep track of the mouse movement events.

<script src="/path/to/cdn/jquery.slim.min.js"></script>

2. Create a container to hold the current coordinates of your mouse.

<h3>The coordinates of your mouse:</h3>
<h3 id="h3"></h3>

3. Get and output the current mouse position.

$(document).ready(function(){

  $(this).mousemove(function(e){  

    const selector = document.querySelector("#h3");

    const coordsText="Coords: X: "+e.clientY+" Y: "+e.clientX;
      
    selector.textContent=coordsText;

  });
  
});

This awesome jQuery plugin is developed by Anone-Imouse. For more Advanced Usages, please check the demo page or visit the official website.