Hi,
how can I get the absolute position of a relative element?
We dynamically create a page with multiple segments which are relatively
ordered among each other. In these segments we have input fields.
When such an input field is focused I need it's absolute position.
Is there a way to do so with IE > 6?
thanks...
bye Stephan... 10 2354
"Andrew Thompson" <Se********@www .invalid> schrieb im Newsbeitrag
news:1r******** *************** ******@40tude.n et... On Mon, 14 Jun 2004 17:20:57 +0200, Stephan Koser wrote: ... Is there a way to do so with IE > 6?
That would be IE 7, IE 8,.. would it? ;-)
Oh, sorry - that's completely wrong. I mean: IE >= 5 !
bye...
On Mon, 14 Jun 2004 17:20:57 +0200, Stephan Koser <sk****@web.d e> wrote: Hi,
how can I get the absolute position of a relative element?
We dynamically create a page with multiple segments which are relatively ordered among each other. In these segments we have input fields. When such an input field is focused I need it's absolute position. Is there a way to do so with IE > 6?
thanks...
bye Stephan...
Hi Stephan,
This is from the X Library ( http://cross-browser.com/). You don't have to use the library, but this should give you some ideas. Two library functions are not provided here: xDef() returns true if all it's arguments are 'defined'; xGetElementById () works as you would expect.
function xPageX(e) {
if (!(e=xGetElemen tById(e))) return 0;
var x = 0;
while (e) {
if (xDef(e.offsetL eft)) x += e.offsetLeft;
e = xDef(e.offsetPa rent) ? e.offsetParent : null;
}
return x;
}
function xPageY(e) {
if (!(e=xGetElemen tById(e))) return 0;
var y = 0;
while (e) {
if (xDef(e.offsetT op)) y += e.offsetTop;
e = xDef(e.offsetPa rent) ? e.offsetParent : null;
}
return y;
}
Mike Foster wrote:
<snip> function xPageX(e) { if (!(e=xGetElemen tById(e))) return 0; var x = 0; while (e) { if (xDef(e.offsetL eft)) x += e.offsetLeft; e = xDef(e.offsetPa rent) ? e.offsetParent : null; } return x; } function xPageY(e) { if (!(e=xGetElemen tById(e))) return 0; var y = 0; while (e) { if (xDef(e.offsetT op)) y += e.offsetTop; e = xDef(e.offsetPa rent) ? e.offsetParent : null; } return y; }
As an observation, there are two other considerations in calculating the
position of elements on a page. Borders around elements and elements
within other elements with scrolling overflow that are partially
scrolled. Borders can be coped with either using clientTop/Left or
getting top and left border px dimensions from a calculated style
object, on more recent browsers.
Scrolling on containing elements can be addressed with scrollTop/Left,
where supported, but Opera 7 makes it a pain to attempt that with inline
elements.
In the vast majority of contexts neither of these additional factors
will apply.
Richard.
Mike Foster wrote:
<snip> function xPageX(e) { if (!(e=xGetElemen tById(e))) return 0;
<snip> ^
I forgot to mention; wouldn't returning NaN at that point be a better
indicator of failure, as it is always possible that the referenced
element actually is 0px offset into the page.
Richard.
On Tue, 15 Jun 2004 21:03:51 +0100, Richard Cornford <Ri*****@litote s.demon.co.uk> wrote: Mike Foster wrote: <snip> function xPageX(e) { if (!(e=xGetElemen tById(e))) return 0; <snip> ^
I forgot to mention; wouldn't returning NaN at that point be a better indicator of failure, as it is always possible that the referenced element actually is 0px offset into the page.
Richard.
You're assuming that Javascript programmers actually validate return values - even C programmers don't do that as much as that should ;-) Yes, technically it should return an error code not in the function domain and your suggestion (NaN) fits the bill perfectly. Actually I have many functions which don't return an error code - my reasoning then, as I remember it, was that the functions would be more likely to fail gracefully this way. You have a good point tho and I'm not so sure my original idea worked as well as I thought it might. This just hasn't come up in quite a while :-) I hesitate to make indiscriminate changes because many people are using the core functions. Still, its a good idea so I may have to put this on the to-do list ;-)
Thanks!
Mike
Mike Foster wrote: Richard Cornford wrote:
<snip> You're assuming that Javascript programmers actually validate return values - even C programmers don't do that as much as that should ;-)
I would be being very short-sighted if I assumed any such thing. The
unfortunate reality is the vast majority of the people authoring
javascript are not programmers, don't really understand what they are
doing and do not apply any standards to what they produce (or even
aspire to). But that is not a good reason for making it difficult for
those that do.
In reality javascript programmers (at least those working with web
browsers) have more reason for being defensive and cautions than C
programmers do. A C program in an equivalent context, interacting with a
DOM, could be written with a fair confidence about the DOM
implementation. At minimum it could expect to only have to work with one
implementation at a time, and that implementation would be known.
Browser scripts are written to be sent out to unknown browser software
where they realistically should expect to find numerous more or less
divergent DOM implementations . Script failure is a consequence so
inevitable in that context that its controlled handling should be
written into the script, and that means checking to see when it can be
predicted, is happening or has happened.
Learning how to do that efficiently is a major part of learning to be
good at browser scripting. for example, if your function returned NaN on
the first call it could reasonably be assumed that it would continue to
do so. There would be no point calling it again. While a non-NaN numeric
return value on the first call would be grounds to assume that all
subsequent calls will also returned non-NaN values (subject to the
element not being removed from the DOM by the script). Testing that you
have a position reporting facility before its use is vital but, once
checked, testing all subsequent returned values would needlessly slow
the script down.
<snip> ... , was that the functions would be more likely to fail gracefully this way.
It is really the code employing the functions that should be failing
gracefully, as it is the code that would be written with a knowledge of
what was appropriate as a response to failure in its context.
<snip> ... . I hesitate to make indiscriminate changes because many people are using the core functions. ...
<snip>
Yes, you can be certain that if you change the behaviour of an API, even
objectively for the better, then some of the code written to use
previous versions it will promptly fail.
Richard.
Richard Cornford said: Mike Foster wrote: You're assuming that Javascript programmers actually validate return values - even C programmers don't do that as much as they should ;-) I would be being very short-sighted if I assumed any such thing. The unfortunate reality is the vast majority of the people authoring javascript are not programmers, don't really understand what they are doing and do not apply any standards to what they produce (or even aspire to). ...
LOL! I was a C programmer long before I started this Javascript hobby. That
influences my perspectives. I usually refer to scripters as "programmer s"
as a sign of coder respect and camaraderie, and to inspire them to "aspire
to apply standards to what they produce", and to raise the overall
respectability of their craft and industry. Neverthless I do recognize that
many scripters are web designers who are forced to use scripting - and they
don't really want to get too deep into it.
Richard Cornford said: But that is not a good reason for making it difficult for those that do.
Point well taken. I'm sure I will eventually implement your suggestion.
While we're on this topic I'd be grateful for anyone's thoughts on appropriate
error codes to return from other functions. Looking thru my functions I see
3 different data types returned: Number, String and Element.
1. If a function normally returns a number I will return NaN as an error code.
2. If a function normally returns a string, as an error code should it return
null instead of returning an empty string?
3. If a function normally returns an element reference is it appropriate to
return null as an error code? (I think this one is right)
... Testing that you have a position reporting facility before its use is vital but, once checked, testing all subsequent returned values would needlessly slow the script down.
I agree. When I post little demos for people I usually assume that such checks
will be done eariler. Still, these functions are not representative of most of
my 'core' functions which test for object existence before using the object.
Correcting this is also a task now going on my to-do list ;-)
Thanks for your replies,
Mike
Mike Foster wrote: Richard Cornford said:
<snip> ... . Neverthless I do recognize that many scripters are web designers who are forced to use scripting - and they don't really want to get too deep into it.
Forced to? Someone is holding a gun to their head? Want to use scripting
certainly, need to be able to offer scripting it in order to compete in
their chosen profession, probably, but I don't see how they could be
"forced to" use scripting.
Unfortunately a combination of a desire to program one of the most
unreliable and inconsistent software environments that exists (the web
browser), and an unwillingness to learn programming at all, is not
likely to results in a successful outcome. And a quick sample of
Internet browser scripts would rapidly reveal how spectacularly
unsuccessful that outcome can be.
<snip> 2. If a function normally returns a string, as an error code should it return null instead of returning an empty string?
Strings can be a bit of a problem as an empty string is a reasonable
error when a string of data (so non-empty) marks success, and easy to
test by type-converting it to boolean. Returning null is probably the
only sensible option when an empty string could be a meaningful results,
and all strings are != null.
3. If a function normally returns an element reference is it appropriate to return null as an error code? (I think this one is right)
That would be my choice, and consistent with return values from
unsuccessful W3C DOM element retrieval methods ... Testing that you have a position reporting facility before its use is vital but, once checked, testing all subsequent returned values would needlessly slow the script down.
I agree. When I post little demos for people I usually assume that such checks will be done eariler.
<snip>
That is always a dilemma because someone seeing a facility employed
without the required associated testing may take it as indication that
doing so is acceptable. While an example that wraps the required testing
directly around the use of the facility being demonstrated (and repeats
those tests for each subsequent use) might be taken as a guide to
implementation, even though that is rarely an efficient style of
implementation. And a full optimal implementation would be a ludicrous
thing to write just to demonstrate the use of one facility for a Usenet
post.
Richard. This thread has been closed and replies have been disabled. Please start a new discussion. Similar topics |
by: Ken Kast |
last post by:
Here's my situation. I have a statically positioned table that has an image
in a cell. I also have some layers, defined by absolute-positioned DIVs for
some animation. Everything works until I scroll/resize. Then the image
"moves" on the screen but the animation doesn't. The net effect is that
their relative positioning changes. I'd like...
|
by: Markus Ernst |
last post by:
Hello
Reading the follwing document:
http://www.w3.org/TR/WD-positioning-970131#In-flow
it seems very clear that position:relative should be relative to the parent
element. So in the following test case element1 and element2 should be
placed side by side inside a centered white container element:
http://www.markusernst.ch/test.htm
|
by: Knut |
last post by:
Hello everybody.
This is my first attempt at Javascript, something that is long
overdue. But please bear that in mind, and have mercy (=
My question is simple:
I'm doing a dropdown menu system to work on the <div>'s produced by
our CMS, and every menubutton div has a onMouseOver="openSubmenu(this,
'popup1234')", where popup 1234 is...
|
by: Gérard Talbot |
last post by:
Hello fellow stylers,
When trying this page
http://www.gtalbot.org/BrowserBugsSection/PercentualRelativePositioning.html
I get different rendered layouts with IE 6, IE 7 beta 2, Firefox 1.5.0.2
and Opera 9.0 build 8367.
Firefox 1.5 and Opera 9 will just ignore the CSS declaration
|
by: Samuel |
last post by:
Hi,
Is it possible to get absolute position of element with javascript?
e.g. I have textbox somewhere in table. Textbox relative to table cell
position is 0,0. How can I get Textbox absolute position on page??
Please, any ideas, I'm going crazy...
thanks
| |
by: Petra Meier |
last post by:
Hi,
I use the common code to determine the position of an element
getTop = function(o){
var nTop = null;
if(o){
do{
nTop += o.offsetTop;
|
by: Mark |
last post by:
According to my book on CSS, if you apply 'position: relative' to a
block-level element, it will stay exactly where it is. However, you can
then use top, left etc. to offset the element relative to its position.
However, looking at other people's stylesheets, I often see 'position:
relative' applied to elements but without the use of top,...
|
by: Bassem |
last post by:
Hi,
I've two div.s. One contains four images, when click on one, a JS function create an image corresponding to it and append it to the second div.
I'm attempting to make each new image is to be movable.
I'm trying for three days with many searches to create a DragPanel and set its TargetControlID to the certian images on the client side. I...
|
by: Jezternz |
last post by:
Okay so I want to place a relative division inside an absolutely positioned division.
<div style="position:absolute;left:50px;right:50px;top:50px;bottom:50px">
<div style="position:relative;margin:0 auto;height:100%;width:500px;">testing123</div>
</div>
This isn't the code from my website but is good enough for demonstration. So I...
|
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...
|
by: Oralloy |
last post by:
Hello folks,
I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>".
The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed.
This is as boiled down as I can make it. ...
| |
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...
|
by: Hystou |
last post by:
Overview:
Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For...
|
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...
|
by: conductexam |
last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one.
At the time of converting from word file to html my equations which are in the word document file was convert...
|
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...
|
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: muto222 |
last post by:
How can i add a mobile payment intergratation into php mysql website.
| |