- Where Developers Learn, Share, & Build Careers

I am working on a function that I can use to get canvas coordinates. The part of the canvas works well until it disappears on the screen.

When I shrink the window, and scroll down to the bottom right corner, the scene starts from the canvas. How can I decide to get the right coordinates?

This is my code:

  function getMousePosition (event) {var mx = new number (); Var MY = new number (); If (event.x! = Undefined & event.y! = Undefined) {mx = event.x; MY = event.y; } Else {// Firefox method to get the status MX = event.clientX + document.body.scrollLeft + document.documentElement.scrollLeft; My = event.clientY + document.body.scrollTop + document.documentElement.scrollTop; } MX - = canvas.offet left; MY - = canvas.offetoptop; Warning ("X:" + MX + "y:" + MY);   
}   
 
 
 This is the function that I get Canvas coordinates are used:  
  function getCanvasPos (el) {var canvas = document. GetElementById (el); Var _x = canvas.offsetLeft; Var _y = canvas.offsetTop; Whereas (canvas = canvas.offsetParent) {_x + = canvas.offsetLeft - canvas.scrollLeft; _y + = canvas.offsetTop - canvas.scrollTop; } Return {left: _x, top: _y}};   
 ... and here is the function for mouse coordinates  
  function mousepost (e) {var mouseX = e.clientX - getCanvasPos (e.target ). Left + window.pageX offset; Var Mouse Y = e.clientY - getCanvasPos (e.target) .top + window.pageYOffset; Return {x: mouseX, y: mouseY}; };   
 The mouse event listener is seeing something like this:  
  canvas.addEventListener ('mousemove', function (e) {console.log (canvas MousePos (E) .x);});