getting mouse position relative to content area of an element

Question

When the mouse is moved over an element, I want to get the mouse coordinates of the cursor relative to the top-left of the element\'s content area (this is the area excludin

Answer 1

I am not sure if this is the best way, or most resource efficient...

But I would suggest getting X/Y for the canvas tag, width of the border, and padding and using them all together as the offset.

Edit:

Use offsetLeft and offsetTop

Reference: How to Use the Canvas and Draw Elements in HTML5

var x;
var y;
if (e.pageX || e.pageY) { 
  x = e.pageX;
  y = e.pageY;
}
else { 
  x = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft; 
  y = e.clientY + document.body.scrollTop + document.documentElement.scrollTop; 
} 
x -= gCanvasElement.offsetLeft;
y -= gCanvasElement.offsetTop;