find pixel coordinates of an image

[dakota81]

I'm trying to re-write a page, where it looks fine in Mozilla / FireFox, but does not act the same in IE.

Anyways, I think I can do this if through JavaScript I can obtain the pixel coordinates of an image that is in the page - relative to the entire page. So in other words, I want to use this information to set the placement of another image that is going to be absolutely positioned in the page.

I haven't found the magic google keywords to look this up yet.

 

[dakota81]

Well, I finally found a function through Google that gets me the coordinates I want in both IE & Mozilla/FireFox.

And I can get the desired results in IE now...

But I cannot change the image placement in Mozilla/FireFox yet. It must just be syntax or something, I'll keep searching.

 

[dakota81]

Just an update, issue ended up being the <doctype> declaration at the top. I don't know anything about doctype's, so who knows. It was set to loose, and when I removed the whole line, everything worked in both browsers.

 

[ca8msm]

Maybe you should read up on doctypes before simply removing it as there will most likely be other consequences...


____________________________________________________________

Need help finding an answer?

Try the Search Facility or read FAQ222-2244 on how to get better results.

 

[dakota81]

I see two different doc types, the "loose" and the "strict", where it seems that the "loose" just lets me be more liberal in where I define css properties. And removing the doctype tag makes the browsers treat the document like it had the "loose" doctype.

All I know right now is with either loose or strict doctype decleration, I cannot adjust some of the css properties through JavaScript in Mozilla.

If you have any other insights into what the different doc-types are, then by all means, please list some differences.

 

[glenmac]

Doctypes are listed here.

http://www.w3.org/QA/2002/04/valid-dtd-list.html

Glen

http://lantzvillecomputers.com

 

[ca8msm]

Also, read Jeff's post on doctypes:

thread215-1168516


____________________________________________________________

Need help finding an answer?

Try the Search Facility or read FAQ222-2244 on how to get better results.

 

[dakota81]

Well, I had already read over those pages, the issue is that with either doctype decleration, the following JavaScript line would not work in Mozilla 1.7.12 (the latest version):

document.getElementById('prodimage').style.top=100;


Whether it's a bug in Mozilla or not, I need JavaScript to work, and the only way to do it is to not define any doctype.

I went down that list and tried every different doctype. None of them reproduced the layout and functionality of the page when there was no doctype declared. So then what?

 

[dakota81]

Okay, I was ready to put a test page up on the web to show as an example...

And when I uploaded it to a server, everything worked as it should.

But however, it still stands that when the .html file is on my local hard drive, neither Mozilla -or- Internet Explorer work correctly with the doctype decleration. Maybe it's something unique to my computer & internet connection setup, I'm not sure.

I'd like to know though if anyone has any insight.

 

[dakota81]

I take that back, there still are some issues with the <doctype>, Mozilla, & JavaScript. The test page I put up worked, but the actual page I'm writting does not, it is a ColdFusion page, so maybe the .cfm extension makes a difference, I don't know.

 

[manarth]

the .cfm won't make the blindest bit of difference, but issues such as paths and case sensitivity are usually the cause of differences between local development and served pages.


finding the pixel co-ordinates of an image is annoying, due to differences in various box models. but it can be done, even with a doctype.

instead of .style.top, there are numerous position properties including offsetTop and many others.

---
Marcus
better questions get better answers - faq581-3339
accessible web design - zioncore.com