473,729 Members | 2,405 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

Different offsetLeft/Top calculation for elements contained in DIV and TABLE/TD

Hello

In the code below, theres a DIV, a TABLE and another DIV , each with an
image in it.

When i read out the offsetLeft/Top from imgB in the table , i get offset
values relative to the containng TD ... *as it should be*, HOWEVER, the
offsetLeftTop values for imgA/C in the DIVs are calulated realtive to the
window border ???? is this normal

this happens on both NS7 & IE6

sample code (you can copy/paste ... i tested this):

<html>
<head>
<script language="JavaS cript">
onload = function(){
var imgA = document.getEle mentById('imgA' );
var imgB = document.getEle mentById('imgB' );
var imgC = document.getEle mentById('imgC' );

alert(imgA.offs etLeft)
alert(imgA.offs etTop)

alert(imgB.offs etLeft)
alert(imgB.offs etTop)

alert(imgC.offs etLeft)
alert(imgC.offs etTop)

}

</script>
</head>

<body>

<div>
<img src="0.jpg" id="imgA" width="100" height="100">
</div>

<table>
<tr>
<td>
<img src="1.jpg" id="imgB" width="100" height="100">
</td>
</tr>
</table>

<div>
<img src="2.jpg" id="imgC" width="100" height="100">
</div>
</body>
</html>

Jul 20 '05 #1
2 2385


Pieter Van Waeyenberge wrote:
In the code below, theres a DIV, a TABLE and another DIV , each with an
image in it.

When i read out the offsetLeft/Top from imgB in the table , i get offset
values relative to the containng TD ... *as it should be*, HOWEVER, the
offsetLeftTop values for imgA/C in the DIVs are calulated realtive to the
window border ???? is this normal


offsetLeft/offsetTop are relative to the offsetParent which can be
different from parentNode.

--

Martin Honnen
http://JavaScript.FAQTs.com/

Jul 20 '05 #2
thnx!

"Martin Honnen" <ma*******@yaho o.de> wrote in message
news:40******@o laf.komtel.net. ..


Pieter Van Waeyenberge wrote:
In the code below, theres a DIV, a TABLE and another DIV , each with an image in it.

When i read out the offsetLeft/Top from imgB in the table , i get offset values relative to the containng TD ... *as it should be*, HOWEVER, the
offsetLeftTop values for imgA/C in the DIVs are calulated realtive to the window border ???? is this normal


offsetLeft/offsetTop are relative to the offsetParent which can be
different from parentNode.

--

Martin Honnen
http://JavaScript.FAQTs.com/

Jul 20 '05 #3

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

11
2028
by: Saqib Ali | last post by:
Please excuse me, this is a fairly involved question that will likely require you to save the file below to a file and open it in a browser. I use Mozilla 1.5, so the problem I describe below should be reproducible with that version at least. BACKGROUND: =========== When you open this page in your browser, you will see a 4 cell table. The cells contain the following items respectively:
4
6799
by: Keith Thornhill | last post by:
I'm trying to calculate the top and left distance from the side of the browser of an object (either absolutely or relatively positioned) and i'm running into a weird problem as i'm trying to make the code cross-browser. normally i simply use the .offsetLeft/Top properties of the object to get my numbers, and it is as simple as that. but in Firefox (v. 0.9.3), they both return the value "8" no matter where the object appears on the page....
3
7645
by: ara.pehlivanian | last post by:
I've got a script that determines the true position of an element in the page by cycling up the .offsetParent elements all the way up to the <body> element and tallying up the .offsetLeft values returned by each element. It works fine on the major browsers (IE, Moz, NS) on PC but Safari on the Mac returns "0" for the offsetLeft right off the body tag when it should be a greater value than that. Anybody already deal with this? Thank you...
12
7008
by: Susan Cranford | last post by:
Please forgive, I have looked at so much info I can't figure out how to put it together even though I know it must be fairly simple. I have an array of input text boxes (txtDOBn) where n is created at load. On the onchange event I want to calc the age and show in adjacent input text boxes that are readonly and also arrays (an age calced for each DOB entered). I was going to use the datediff function in vbscript to do the calc. Can...
10
7734
by: Matt Kruse | last post by:
See: http://www.mattkruse.com/temp/offsetleft.html It appears that the offsetLeft value in IE6 (other versions not tested) incorrectly ignores the border width on a DIV when there is a width: property specified. Without a specified width: it gets it correct. Does anyone know 1) If this is a known bug, and if it affects any other browsers? I tested a few and found no problems.
2
2117
by: Gary Coutts | last post by:
Hi, I am developing a website using Visual Studio .Net 2003. When reading offsetLeft, in a javascript function, the result is fine when run under I.E. but gives wrong results when run under Firefox. The HTML and java are shown below: /-------------------------------HTML-------------------------------------------------------/
11
4077
by: David Stone | last post by:
I'm trying to figure out how to avoid tables when presenting a sidebar on an html 4 strict page, by using div instead. I've run into a situation where I get different rendering of the elements within the main div, depending on whether it is contained within a <td> or a <div> - http://www.chem.utoronto.ca/~dstone/test1.html http://www.chem.utoronto.ca/~dstone/test2.html I've been trying to understand why, particularly, the <ul>
2
11107
by: rohitchawla | last post by:
have a problem with this code when working in IE it gives me 0,0 coords when i use iframe tag but gives correct coords when using firefox function GetRealOffset(id) { var elem = document.getElementById(id); var leftOffset = elem.offsetLeft; var topOffset = elem.offsetTop; var parent = elem.offsetParent;
5
5479
by: montybytes | last post by:
Hi there, Although, I have already placed this question in the HTML/CSS section, perhaps it might be worthwhile asking the question here as well. I have a JavaScript function which retrieves the left-position of an Element. This JavaScript functions works in FF and IE7 but does not work in IE6, In IE6 it retrieves the wrong offsetLeft value. Having investigated the problem I noticed it had something to do with the margin-left and position...
0
8921
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However, people are often confused as to whether an ONU can Work As a Router. In this blog post, we’ll explore What is ONU, What Is Router, ONU & Router’s main usage, and What is the difference between ONU and Router. Let’s take a closer look ! Part I. Meaning of...
0
8763
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can effortlessly switch the default language on Windows 10 without reinstalling. I'll walk you through it. First, let's disable language synchronization. With a Microsoft account, language settings sync across devices. To prevent any complications,...
0
9284
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that captivates audiences and drives business growth. The Art of Business Website Design Your website is...
0
9148
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the choice of these technologies. I'm particularly interested in Zigbee because I've heard it does some...
0
8151
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own.... Now, this would greatly impact the work of software developers. The idea...
1
6722
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms. Adolph will...
0
4528
by: TSSRALBI | last post by:
Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in the same network. But I'm wondering if it's possible to do the same thing, with 2 Pfsense firewalls...
0
4796
by: adsilva | last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
1
3238
by: 6302768590 | last post by:
Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.