Forum Moderators: open

Message Too Old, No Replies

How can i get coordonate into a DIV like this

         

Toucouleur

10:21 am on Jan 25, 2007 (gmt 0)

10+ Year Member



Sorry if the question has already been posted and answered, but I spent hours on Google & Yahoo search engine on the present messageboad, and I didn't find the solution.

I've a DIV (widht: 80px; float: left;)

I need to get the coordinates inside this DIV

Not the coordinate of the overall document, but just to get and retrieve coordinates from the DIV only.

I need to get the coodinate and to launch a function for exemple Y > 20 do this function but I need to launch them if the mouse move, so I need to trap the event.

I've tryed to catch it like that


<script language="javascript">
var divObj;
document.onmousemove=getMouseCoordinates;

function getMouseCoordinates(event)
{
ev = event ¦¦ window.event;
divObj.innerHTML = "Mouse X:"+ev.pageX + " Mouse Y:"+ev.pageY ;
}

//assign the mouseCoord Object to divObj
function loadDiv()
{
divObj = document.getElementById("mouseCoord");
}
</script>
</head>

<body onLoad="loadDiv()">
<div id="mouseCoord" style="with: 300px; height: 200px; position: absolute; top: 200px; left: 300px; border: 1px solid #000;">Mouse Coordinates position will be displayed here.
</div>
</body>

but it gets only the whole window...

Could exist a way to catch event on a DIV only?

thanks so much by advance...

[edited by: Toucouleur at 10:22 am (utc) on Jan. 25, 2007]

[edited by: jatar_k at 1:23 pm (utc) on Jan. 25, 2007]
[edit reason] no urls thanks [/edit]

daveVk

11:58 pm on Jan 25, 2007 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Could exist a way to catch event on a DIV only?

divObj.onmousemove=getMouseCoordinates;

Toucouleur

6:57 am on Jan 26, 2007 (gmt 0)

10+ Year Member



of course it works, but if your dv is a foat, and not absolute positionned layer, how do you get the coordonate of the inside layer

[edited by: encyclo at 5:54 pm (utc) on Jan. 26, 2007]
[edit reason] See terms of service [webmasterworld.com] [/edit]

daveVk

1:04 pm on Jan 26, 2007 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



[webmasterworld.com...] and similar for findY (offsetTop)

Toucouleur

1:29 pm on Jan 26, 2007 (gmt 0)

10+ Year Member



thanks for your help Dave, but it doesn't help me :(

try this script and you will see, whatever I do, x= 300 :(

<html>
<head>
<title>Get Mouse Coordinates</title>
<script language="javascript">
var divObj;
function getMouseCoordinates(event)
{
var x = 0;
obj = document.getElementById("mouseCoord");
while (obj) {
x += obj.offsetLeft
obj = obj.offsetParent;
}
divObj.innerHTML = "Mouse X:"+x ;
}

//assign the mouseCoord Object to divObj
function loadDiv()
{
divObj = document.getElementById("mouseCoord");
divObj.onmousemove=getMouseCoordinates;
}
</script>
</head>

<body onLoad="loadDiv()">
<div id="mouseCoord" style="with: 300px; height: 200px; position: absolute; top: 200px; left: 300px; border: 1px solid #000;">Mouse Coordinates position will be displayed here.
</div>
</body>
</html>

[edited by: Toucouleur at 1:30 pm (utc) on Jan. 26, 2007]

cmarshall

4:21 pm on Jan 26, 2007 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Toucouleur, check your PM (StickyMail).

daveVk

11:43 pm on Jan 26, 2007 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



divObj.innerHTML = "Mouse X:"+x - ev.pageX