CODEWITHSUNDEEP
htmlfirefoxcanvasonmouseover
Ten_of_a_Kind
Ten_of_a_Kind

Reputation: 61

onmouseover and canvas, not continuous

I'd like to display continuously updating coordinates when the mouse is over a canvas.

The below Firefox-tested code should produce this, but onmouseover is only called when the mouse enters the canvas. When over it, nothing happens and the coordinates are not updated.

<HTML>
<BODY>

<Canvas width="200" height="200" onmouseover="myMouse(event)">No support</Canvas>
<P id="text"/>

<Script>
function myMouse(event) {
    document.getElementById("text").innerHTML = "Position = " + event.clientX + ", " + event.clientY;
}
</Script>

</BODY>
</HTML>

What can I do to have onmouseover be continuous, and not only update when the mouse enters the canvas?

On the web, the closest subject I've found was this, but they did not answer the question on making this work ... I must be missing something.

Upvotes: 1

Views: 3593

Answers (1)

j08691
j08691

Reputation: 207993

Instead of onmouseover try onmousemove.

The onmouseover event fires when the mouse moves over an element once. The onmousemove event fires whenever the mouse is being moved.

jsFiddle example.

https://developer.mozilla.org/en/DOM/element.onmousemove

Upvotes: 3

Related Questions