How Can I Find Mouse Position Inside of a Div Tag?

[vunet.us]

I have a DIV element. How can I find mouse position (top and left)
inside of this DIV?

<div onMouseMove="getPositions();"
style="width:200px;height:100px"></div>

function getPositions(ev){
????????????????
}

 

[pcx99]

I have a DIV element. How can I find mouse position (top and left)
inside of this DIV?

<div onMouseMove="getPositions();"
style="width:200px;height:100px"></div>

function getPositions(ev){
????????????????
}

function getPositions(ev) {
if (ev == null) { ev = window.event }
_mouseX = ev.clientX;
_mouseY = ev.clientY;
}

 

[Peter Michaux]

I have a DIV element. How can I find mouse position (top and left)
inside of this DIV?

This is difficult. The event object has clientX and clientY properties
which describe where the event occurred relative to the browser window
in pixels. If you then add the amount by which the page has been
scrolled then you know where the event occurred relative to the web
page. Now if you can determine the position of the div relative to the
web page then you will can subtract the position of the div from the
position of the event and they you have your answer. Determining the
position of the mouse relative to the page is relatively easy.
Determining the position of the div relative to the page may be very
difficult in general but easy in certain cases.

Peter

 

[pcx99]

This is difficult. The event object has clientX and clientY properties
which describe where the event occurred relative to the browser window
in pixels. If you then add the amount by which the page has been
scrolled then you know where the event occurred relative to the web
page. Now if you can determine the position of the div relative to the
web page then you will can subtract the position of the div from the
position of the event and they you have your answer. Determining the
position of the mouse relative to the page is relatively easy.
Determining the position of the div relative to the page may be very
difficult in general but easy in certain cases.

Peter

http://www.quirksmode.org/js/findpos.html

Quirksmode has a function which returns the top and left position of the
target element, that can be subtracted from the current mouse position
to obtain relative positions. It's a useful clip, I think the
javascript faqs have something similar too.

 

[Peter Michaux]

http://www.quirksmode.org/js/findpos.html

Quirksmode has a function which returns the top and left position of the
target element, that can be subtracted from the current mouse position
to obtain relative positions. It's a useful clip, I think the
javascript faqs have something similar too.

The quirksmode script will only work for very limited set of simple
pages where there are not scrolled elements and other various trickier
situations. The Yahoo! UI, ajaxtoolbox, and Flanagan's book have
better but not generally applicable position reporting functions which
is a difficult problem in general.

Peter