Forum Moderators: open
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]
[edited by: encyclo at 5:54 pm (utc) on Jan. 26, 2007]
[edit reason] See terms of service [webmasterworld.com] [/edit]
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]