Can you get X Y Co-ordinates of Image ? 1

[NigeW]

Hi

I am wanting to know if it is possible to obtain the X Y co-ordinates of an image displayed on a page ?

I would be happy if it is only the top left position of the image.

So far I have struck blanks . . .

Any suggestions graetfully received.

Thanks

Nigel Wilson
"kiwi-kid"

http://www.potentialunlimited.co.nz

 

[vbkris]

why would u want to do that? the only way i can see is put the image in a layer and get the X,Y position of the layer...

Known is handfull, Unknown is worldfull

 

[BillyRayPreachersSon]

If you assign an ID to your image, you can use document.getElementById('yourImageIdHere') to get a pointer to the image object... then you can query its properties... in IE (I'm not sure about other browsers), I believe these include ".offsetLeft" and ".offsetTop", which may help you.

Dan

 

[NigeW]

Hi vbkris / BillRayPreachersSon

Firstly thanks to your suggestion Billy - this works to a certain degree. In IE it gets the X/Y values in relation to the parent object, i.e. if the image is in a table cell then the X/Y co-ordinates are from the top left of the table cell rather than the top left of the screen.

I have also tried nesting the image in a layer, but because the layer is not absolutely positioned there are no X/Y co-ordinates for the layer.

The reason I am wanting to do this is for the content management application 'HTMLArea' - this is a textarea and so you cannot specify the height / width attributes of the textarea. Therefore I Was wanting to dynamicaly build the textarea based on the users browser resolution, i.e. get the x/y of an image above and below the textrea and then calculate the difference and make the height of the textarea the difference.

Another possible solution is to use screen.height / screen.width, but this is not totally accurate as toolbars take up differing amounts of space.

Thanks again for your interest / suggestions.

Nigel Wilson
"kiwi-kid"

http://www.potentialunlimited.co.nz

 

[BillyRayPreachersSon]

Aha - a search through the archives reveals this thread:

thread216-735323

which I think should do the job you're after ;o)

Hope this helps,
Dan

 

[NigeW]

Hey Dan

Good searching my man - I did complete a search within javascript forums but found nothing - good lesson for me there.

Based on the thread I've amended the code and it now works in IE, Netscape and Mozilla.

The code is

<script>
var t = 0;
var l = 0;
var cNode = document.images["botspacer"];
while(cNode.tagName!='BODY'){
l+=cNode.offsetLeft;
t+=cNode.offsetTop;
cNode=cNode.offsetParent;
}

alert("position, left:" + l + " and top:" + t);
</script>

A star goes to you Dan for your help - thanks heaps.

Upward and onward . . .

Nigel Wilson
&quot;kiwi-kid&quot;

http://www.potentialunlimited.co.nz