By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
437,605 Members | 2,137 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 437,605 IT Pros & Developers. It's quick & easy.

absolute x,y coordinates of an image?

P: n/a
Hello,
Is it possible to find out the absolute coordinates of the upper
left corner of an image on my html page? I need to use javascript to
overlay something next to it exactly 50 pixels to the right of it.

Much thanks for your help, - Dave

Oct 7 '05 #1
Share this Question
Share on Google+
6 Replies


P: n/a
Sure:

function measureLeft(oElement){
var iLeft = oElement.offsetLeft;
var oParent = oElement.offsetParent;
while(oParent.nodeName != 'BODY'){
iLeft += oParent.offsetLeft;
oParent = oParent.offsetParent;
}
return iLeft;
}

function measureTop(oElement){
var iTop = oElement.offsetTop;
var oParent = oElement.offsetParent;
while(oParent.nodeName != 'BODY'){
iTop += oParent.offsetTop;
oParent = oParent.offsetParent;
}
return iTop;
}

Oct 7 '05 #2

P: n/a
Note that the code below may fail under various conditions, such as IE
running in strict mode, or if there are scrollable elements such as DIVs
within the page.

See http://www.mattkruse.com/javascript/...sitionTest.php for my
attempt at a more generalized position-finding function. It's not complete
yet, but is more reliable than the method used by most (like the one below).

michael elias wrote:
Sure:

function measureLeft(oElement){
var iLeft = oElement.offsetLeft;
var oParent = oElement.offsetParent;
while(oParent.nodeName != 'BODY'){
iLeft += oParent.offsetLeft;
oParent = oParent.offsetParent;
}
return iLeft;
}

function measureTop(oElement){
var iTop = oElement.offsetTop;
var oParent = oElement.offsetParent;
while(oParent.nodeName != 'BODY'){
iTop += oParent.offsetTop;
oParent = oParent.offsetParent;
}
return iTop;
}


(top-posted for easier reading)

--
Matt Kruse
http://www.JavascriptToolbox.com
http://www.AjaxToolbox.com
Oct 7 '05 #3

P: n/a
michael elias a écrit :
Sure:

function measureLeft(oElement){
var iLeft = oElement.offsetLeft;
var oParent = oElement.offsetParent;
while(oParent.nodeName != 'BODY'){
iLeft += oParent.offsetLeft;
oParent = oParent.offsetParent;
}
return iLeft;
}

function measureTop(oElement){
var iTop = oElement.offsetTop;
var oParent = oElement.offsetParent;
while(oParent.nodeName != 'BODY'){
iTop += oParent.offsetTop;
oParent = oParent.offsetParent;
}
return iTop;
}


This won't work in MSIE 6 if the image is absolutely positioned.

Gérard
--
remove blah to email me
Oct 8 '05 #4

P: n/a
la***********@zipmail.com wrote:
Hello,
Is it possible to find out the absolute coordinates of the upper
left corner of an image on my html page? I need to use javascript to
overlay something next to it exactly 50 pixels to the right of it.

Much thanks for your help, - Dave


Everything you need is here:

<URL:http://www.quirksmode.org/js/findpos.html>
--
Rob
Oct 8 '05 #5

P: n/a
RobG wrote on 08 okt 2005 in comp.lang.javascript:
Everything you need is here:

<URL:http://www.quirksmode.org/js/findpos.html>


All you need is love?

--
Evertjan.
The Netherlands.
(Replace all crosses with dots in my emailaddress)

Oct 8 '05 #6

P: n/a
Sadly, this doesn't work for me on IE 6.0 (Win 2000). IE always
returns 0 when I call findPosX(document.getElementById('navImg'));

Is my HTML formatted incorrectly?

<tr>
<td><img id="navImg" name="navImg" src="images/NAV_07.gif" alt=""
border="0"></td>

<td>

Andt he JS is use is

function calculateLeftCoords() {
leftPos = findPosX(document.getElementById('navImg')) + 45;

Any help is appreciated, - Dave

Oct 8 '05 #7

This discussion thread is closed

Replies have been disabled for this discussion.