CODEWITHSUNDEEP
javascriptimageposition
Jakub
Jakub

Reputation: 13

Getting X and Y values of an image in IE by javascript?

I was googling for this for a long time, but nobody seems to be solving the same thing. I am quite new to javascript, so my question may be dumb, sorry in advance.

I am working on a script that would find all images on the site and return bunch of parameters for each, including x and y position of the image.

In FF and Chrome, the obejct.x and object.y properties work fine, but in IE I get 'undefined' value. Do you know about any way I could make IE return me the X and Y position of images? This can be even relative to its parent div as I don't need to know the absolute position in the page.

Also, I noticed that there is a difference in how FF and Chrome count the coordinates when the image has its position set to relative. Chrome seems to count it incorrectly as it actually only returns the top and left value, while FF correctly adds top and left to the original position values. It would be nice if you knew a trick for this too.

Although I suppose it is not needed in this case, I attach the particular part of code.

function showPos() {

var imgs;
imgs = document.getElementsByTagName('img');

for(i=0; i<imgs.length; i++)
{
   alert(imgs[i].x + imgs[i].y);
}

}

Thanks in advance and have a great holiday! Jakub

Upvotes: 1

Views: 487

Answers (2)

Scott Baker
Scott Baker

Reputation: 10443

You could look into the JQuery library - they have a cross-browser solution for finding the coordinates of an image. You can use .offset() to find position relative to the document, or .position() to find it relative to the offset parent.

Upvotes: 2

dizzwave
dizzwave

Reputation: 4469

Have you tried the offsetTop and offsetLeft properties of the images?

Example

Upvotes: 0

Related Questions