I am tracking mouse movements using the following JavaScript:

var mouseX = 0;
var mouseY = 0;

document.onmousemove = function (e) {
    mouseX = e.clientX;
    mouseY = e.clientY;
}

My problem is that if the mouse hasn't been moved since the page had been loaded, the mouseX and mouseY values both equal 0. How can I get the mouse values when the page is loaded as well as when the mouse is moved?

I am tracking mouse movements using the following JavaScript:

var mouseX = 0;
var mouseY = 0;

document.onmousemove = function (e) {
    mouseX = e.clientX;
    mouseY = e.clientY;
}

My problem is that if the mouse hasn't been moved since the page had been loaded, the mouseX and mouseY values both equal 0. How can I get the mouse values when the page is loaded as well as when the mouse is moved?

• javascript
• mouse
• mouseevent

• 2 I believe you can't know that. But isn't it feasible to drop the first movement and start with the second? E.g. you start with mouseX = mouseY = null, and in case they're null when onmousemove is fired, then just ignore that first case. – pimvdb Commented Nov 4, 2011 at 17:03
• docs.jquery.com/Tutorials:Mouse_Position – Marc B Commented Nov 4, 2011 at 17:04
• By "page load" do you mean when the document is ready or when the window is loaded? Those are two separate cases. – trusktr Commented Nov 4, 2011 at 17:12
• pimvdb: no that isn't good enough, i need to know where the mouse is even if it hasn't yet moved! I think my solution will be use onload event but loop in conjunction with settimeout loop for if the page isn't fully loaded yet. – flea whale Commented Nov 4, 2011 at 17:13
• @MarcB that doesn't do it for him either. If you notice, when the page is loaded and the mouse hasn't moved, the values are 0, 0. – Some Guy Commented Nov 4, 2011 at 17:16

2 Answers 2

The browser doesn't know where the mouse is until it moves.

It's more complicated than just "get me the cursor position". What if there is no mouse (tablet) or what if the mouse is not over the browser window?

For the same reason, you can't get hover events on an item if the cursor is already hovering when the page loads. It takes a mouse movement for those events to fire.

Go to some site, hover over a link that has a hover effect (like underline), refresh the page (without moving your cursor) and you'll see that even though your cursor is hovering over the link, it doesn't get the hover treatment until you move the cursor.

Unfortunately this is a browser-level issue, not a javascript issue.

You can define mouseover event for the document in order to catch the first mouse interaction on page load.