poizn Posted September 7, 2007 Share Posted September 7, 2007 Hi all Well from the subject, you have probably guess that im trying to get the position of an element on screen with javascript. I created some function of my own, looked around the net, and still they dont work properly. Here are two of the functions I have created (stolen) function findPosX(obj) { var curleft = 0; if(obj.offsetParent) { while(1) { curleft += obj.offsetLeft; if(!obj.offsetParent) break; obj = obj.offsetParent; } } else if(obj.x) { curleft += obj.x; } obj.style.position = "static"; return curleft; } function findPosY(obj) { var curtop = 0; if(obj.offsetParent) { while(1) { curtop += obj.offsetTop; if(!obj.offsetParent) break; obj = obj.offsetParent; } } else if(obj.y) { curtop += obj.y; } return curtop; } function findPos(obj) { var left = findPosX(obj); var top = findPosY(obj); return [left , top]; } function findPosition( oElement ) { if( typeof( oElement.offsetParent ) != 'undefined' ) { for( var posX = 0, posY = 0; oElement; oElement = oElement.offsetParent ) { posX += oElement.offsetLeft; posY += oElement.offsetTop; } return [ posX, posY ]; } else { return [ oElement.x, oElement.y ]; } } I then positioned some elements on screen like so... <body> <div onclick="temp();" id="a">a</div> <div onclick="temp();" id="b" style="width:50%; float:left; background-color:green;">b</div> <div onclick="temp();" id="c" style="">c</div> </body> And have a function temp to alert me the value of the element C function temp() { var temp = findPosition(document.getElementById("c")); alert(temp[0]); alert(temp[1]); temp = findPos(document.getElementById("c")); alert(temp[0]); alert(temp[1]); } The values that I get are clearly wrong ;( Does anyone know why, or how to fix it... Any help will be appreciated Thanks Link to comment https://forums.phpfreaks.com/topic/68329-trying-to-get-elements-position-with-javascript/ Share on other sites More sharing options...
poizn Posted September 7, 2007 Author Share Posted September 7, 2007 Well I dont know why this is, but I think I sort of figured something out... If you float the elements on screen its seems to work, like so... <body> <div onclick="temp();" id="a">a</div> <div onclick="temp();" id="b" style="width:50%; float:left; background-color:green;">b</div> <div onclick="temp();" id="c" style="float:left;">c</div> </body> Sorry i'm really not in the mood to try and explain, so if anyone can do a better job, please post and help me out... Thanks Daniel Link to comment https://forums.phpfreaks.com/topic/68329-trying-to-get-elements-position-with-javascript/#findComment-343673 Share on other sites More sharing options...
emehrkay Posted September 7, 2007 Share Posted September 7, 2007 function getPosition(ele){ var ele = document.getElementById(ele); var pos = {}; pos.left = ele.offsetLeft; pos.top = ele.offsetTop; pos.scrollTop = ele.offsetLeft; pos.height = ele.offsetHeight; pos.width = ele.offsetWidth; return pos; } you now have a hash with the element's width, height, top, left, scrollTop, and scrollWidth. to use you pass in the element's id var stats = getPosition('c'); alert(stats.height); //the height of c Link to comment https://forums.phpfreaks.com/topic/68329-trying-to-get-elements-position-with-javascript/#findComment-343688 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.