да у вас тут черт ногу сломит))
более менее привел в рабочий вариант:
<html>
<head>
<title>example</title>
</head>
<body>
<div style="position: relative; top: 34px;">
<input type='button' value='click me' id="mybutton">
</div>
<!--<script src="http://code.jquery.com/jquery-1.10.2.js"></script>-->
<!--<script src="http://code.jquery.com/ui/1.11.0/jquery-ui.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.11.0/themes/smoothness/jquery-ui.css">-->
<script>
document.getElementById('mybutton').onclick = function ()
{
var $x = $y = 0;
var $Object = this;
while($Object)
{
//Debug($Object.tagName);
$x += $Object.offsetLeft;
if(typeof $Object.scrollLeft != 'undefined')
$x -= $Object.scrollLeft;
$y += $Object.offsetTop;
if(typeof $Object.scrollTop != 'undefined')
$y -= $Object.scrollTop;
$Object = $Object.offsetParent;
}
console.log($x);
console.log($y);
//return {clientX:$x,clientY:$y};
}
</script>
</body>
</html>
и еще.. говорят не рекомендуют вроде как использовать with
http://habrahabr.ru/post/120364/