javascript_howto thread: How to get X & Y position of a text box.
You must insert these two functions in your code and to pass them the
object u want to find the position of...
function findPosX(obj)
{
var curleft = 0;
if (document.getElementById || document.all)
{
while (obj.offsetParent)
{
curleft += obj.offsetLeft
obj = obj.offsetParent;
}
}
else if (document.layers)
curleft += obj.x;
return curleft;
}
function findPosY(obj)
{
var curtop = 0;
if (document.getElementById || document.all)
{
while (obj.offsetParent)
{
curtop += obj.offsetTop
obj = obj.offsetParent;
}
}
else if (document.layers)
curtop += obj.y;
return curtop;
}
next is a short example to show you how it works:
<html>
<head>
<title>Document Title</title>
<script type="text/javascript">
function findPosX(obj)
{
var curleft = 0;
if (document.getElementById || document.all)
{
while (obj.offsetParent)
{
curleft += obj.offsetLeft
obj = obj.offsetParent;
}
}
else if (document.layers)
curleft += obj.x;
return curleft;
}
function findPosY(obj)
{
var curtop = 0;
if (document.getElementById || document.all)
{
while (obj.offsetParent)
{
curtop += obj.offsetTop
obj = obj.offsetParent;
}
}
else if (document.layers)
curtop += obj.y;
return curtop;
}
function getIt(el){
alert('X = ' + findPosX(el) + '\nY = ' + findPosY(el) );
}
</script>
</HEAD>
<body>
<table border="4">
<tr>
<td onclick="getIt(this)"> </td>
<td onclick="getIt(this)"> </td>
<td onclick="getIt(this)"> </td>
<td onclick="getIt(this)"> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td onclick="getIt(this)"> </td>
<td onclick="getIt(this)"> </td>
<td onclick="getIt(this)"> </td>
<td onclick="getIt(this)"> </td>
</tr>
</table>
<p><textarea cols="10" onclick="getIt(this)"></textarea></p>
</body>
</html>
Enjoy! :-))
View Cart
