La esquina superior izquierda de la pantalla es (0, 0) La coordenada i, e, X e Y es (0, 0). Esto significa que el cero vertical es el punto más alto y el cero horizontal es el punto más a la izquierda.
Entonces, la tarea es encontrar las coordenadas del mouse sobre la pantalla.

Se puede encontrar utilizando la propiedad clientX y clientY:

  • ClientX: Da la coordenada horizontal del evento.
  • ClienteY: Da la coordiante vertical del mouse.

Sintaxis:

For X coordinate: event.ClientX
For Y coordiante: event.ClientY

A continuación se muestra la implementación requerida:

<html>

 

<head>

   <script>

 

     

     

     function coordinate(event) {

 

     

     var x = event.clientX;

 

     

     var y = event.clientY;

     document.getElementById("X").value = x;

     document.getElementById("Y").value = y;

  }

    </script>

</head>

 

<!-- onmousemove event is called when the mouse

     pointer is moving over the screen -->

 

<!-- calling of coordinate function -->

 

<body onmousemove="coordinate(event)">

 

   <!-- X coordinate is stored in X-coordinate variable -->

   X-coordinate

   <input type="text" id="X">

   <br>

   <br>

 

   <!-- Y coordinate is stored in Y-coordinate variable -->

   Y-coordinate

   <input type="text" id="Y">

 

</body>

</html>

Producción:

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *