How to get the mouse position without events (without moving the mouse)?

Limitations and workarounds

JavaScript natively caputres the mouse position using mouse event listeners. Alternative methods exist but tend to be less reliable and more convoluted. Here's an outline:

• Invisible overlay creation: Create a div and break down into various <a> elements, revealing the initial mouse position based on hover states.
• CSS hover events: Use :hover pseudoclasses and getComputedStyle() to track hover states on page load.
• Recursive screen division: Implement binary searching to approximate the mouse position.

Drawbacks of workaround techniques

Remember that the trade-off between precision and performance should always be evaluated. Admittedly, an initial overlay sounds appealing, but an overly complex, resource-intensive application is the not-so-appealing aftermath.

Utilizing event listeners and intervals

To understand this workaround, here's how you might implement it:

1. Binary Search: Overlay the viewport with <a> elements to get an approximation of mouse position.
2. Add EventListener: Use mouseenter and mouseleave events to track mouse as it moves over elements.
3. Interval Checks: Retrieve mouse position through regularly scheduled checkups with getComputedStyle().
4. Recursive Refinement: Fine-tune your approximation by dividing hovered areas into smaller segments each time.

The impracticality of it all

Such approaches, while creative in theory, are inefficient, compromise accessibility and user experience, cause performance issues, and are vulnerable to browser updates.

Mouse tracking and web technologies

JavaScript and web technologies are built around an event-driven paradigm. Thus, exploiting CSS and overlaying interactive elements should be considered less favored methods.

Other less conventional approaches

Beyond the above, there are other methods to explore, though each comes with its own caveats.

Querying the last interacted element

Periodically querying the webpage for focus:

let focusedElement;
document.onfocus = (e) => {
  focusedElement = e.target; // Like Sherlock tracking Moriarty!
};


Polling the active element

Poll the document’s active element—particularly useful in form-driven interfaces:

setInterval(() => {
  let activeEl = document.activeElement; // Who's got the spotlight now? 
}, 1000);


External hardware

Another solution could involve external hardware, like an eye tracker, which naturally monitors position without relying on traditional event models.

Handling the feasibility of these approaches

Practicality wise, these methods have limitations. They can be interesting academically but are not advisable for production environments.