I was coding a div element, which acts as a loading bar, to follow the mouse pointer when the mouse enters a specific element. I have it set up so that you can offset the load-bar-div from the center of mouse pointer.
The problem I’m having is that if I offset it only by a small margin, say 3-5px in the x and y direction, even though the mouse cursor is not visibly on the load-bar-div, it still enters it on random occasions, which triggers the “mouseleave” event on the div that I am hovering on.
I was wondering what the focus radius of the mouse pointer is from its center so that I can use this value to configure the load-bar-div offsets.
Here’s the jsFiddle link to the code: http://jsfiddle.net/Vn9sy/
Right now the position of the load bar div just beside the mouse pointer but if you frantically move the mouse around the div box you can see how it randomly resets the loading bar.
The cursor has no “radius”. It is a point. The graphic representing the cursor is just fluff, not part of the actual cursor in terms of what its “on”.