CODEWITHSUNDEEP
javascript
Lombarda Arda
Lombarda Arda

Reputation: 268

Mouse pointer realtime in javascript

I am trying to create a div that consistently show the position of the mouse. The problem is that the previous position is not cleared and this overload the page. The javascript code is as follows:

window.onload = function() {document.onmousemove = muestraInformacion2;}
function muestraInformacion2(elEvento) {
var evento = elEvento || window.event;
var coordenadaX = evento.clientX;
var coordenadaY = evento.clientY;
document.getElementById('info').innerHTML +=
 "<br>--------------------------------------<br>" + coordenadaX+", "+coordenadaY

Upvotes: 0

Views: 182

Answers (2)

OddDev
OddDev

Reputation: 3734

Just remove the "+=". This should work: 

   window.onload = function() {document.onmousemove = muestraInformacion2;}
    function muestraInformacion2(elEvento) {
    var evento = elEvento || window.event;
    var coordenadaX = evento.clientX;
    var coordenadaY = evento.clientY;
    document.getElementById('info').innerHTML ="";
    document.getElementById('info').innerHTML =
     "<br>--------------------------------------<br>" + coordenadaX+", "+coordenadaY

The problem is that you are constantly adding the line (the given string) to the page. But you want to have it as the only data in the innerhtml.

Upvotes: 0

Sajad Karuthedath
Sajad Karuthedath

Reputation: 15767

change your last line to 

document.getElementById('info').innerHTML ="";
document.getElementById('info').innerHTML =
 "<br>--------------------------------------<br>" + coordenadaX+", "+coordenadaY

Upvotes: 2

Related Questions