Imagine a mess of div-elements nested inside each other
some relative, some absolute.
Some of them grows when their children grows...
And at some point, I want the x-coordinate of the bottom
edge of the element that is lowest down on the page.
Of course I need to support the most popular UAs on each
major platform (Not NS4.x)
(In my particular case, I'm only interested in div elements)...
Any hints on this?
TIA...
--
Dag. 8 1484
Dag Sunde wrote: And at some point, I want the x-coordinate of the bottom edge of the element that is lowest down on the page.
Finding the position of an object on a page with arbitrary layout can be
challenging.
My current stab at it can be found here: http://www.mattkruse.com/javascript/objectposition.js
Although, it doesn't currently handle absolutely-positioned elements, and IE
has some problems with relative-positioned objects (still trying to debug
that one!)
If you send me a sample test case, I can use it to verify the functionality
of my lib as I go forward.
--
Matt Kruse http://www.JavascriptToolbox.com http://www.AjaxToolbox.com
Dag Sunde escreveu: And at some point, I want the x-coordinate of the bottom edge of the element that is lowest down on the page.
If you have no way to keep the lowest <div> safe, like "if(newDiv <
lowest) lowest = newDiv", then I can't see a nice way to do it (without
loop) :)
Try the code bellow, I didn't tested much... =/
function getLowestDown(t agName){
function getRect(o){
for(var r = {l: o.offsetLeft, t: o.offsetTop, w: o.offsetWidth, h:
o.offsetHeight} ;
o = o.offsetParent; r.l += o.offsetLeft, r.t += o.offsetTop);
return r;
}
var list = document.getEle mentsByTagName( tagName), i = list.length,
lowest = i ? {o: list[0], r: getRect(list[0])} : {o: null, r: {l: 0,
t: 0, w: 0, h: 0}};
for(var r = lowest.r, y = r.t + r.h; i; (r = getRect(list[--i])).t +
r.h > y && (lowest = {o: list[i], r: r}, y = r.t + r.h));
return lowest;
}
var x = getLowestDown(" div");
alert([x.o, "left: " + x.r.l, "top: " + x.r.t, "width: " + x.r.w,
"height: " + x.r.h].join("\n"));
--
Jonas Raoni Soares Silva http://www.jsfromhell.com
"Matt Kruse" <ne********@mat tkruse.com> wrote in message
news:dp******** @news4.newsguy. com... Dag Sunde wrote: And at some point, I want the x-coordinate of the bottom edge of the element that is lowest down on the page. Finding the position of an object on a page with arbitrary layout can be challenging. My current stab at it can be found here: http://www.mattkruse.com/javascript/objectposition.js
Thank you, I'll take a look at it...
Although, it doesn't currently handle absolutely-positioned elements, and IE has some problems with relative-positioned objects (still trying to debug that one!)
If you send me a sample test case, I can use it to verify the functionality of my lib as I go forward.
Will do, as soon as I've made a self-contained sample...
(This is for a designer friend of mine, and she doesn't
own the pages)...
Her task is to add a footer to an exsisting design.
If the content of the page fits into the client-area,
the footer is supposed to lock itself to the bottom
of the window.
If the content exceeds the height of the window, the
footer should be absolutely positioned x pixels below
the lowest content.
--
Tag.
"Jonas Raoni" <jo********@gma il.com> wrote in message
news:11******** **************@ g43g2000cwa.goo glegroups.com.. . Dag Sunde escreveu: And at some point, I want the x-coordinate of the bottom edge of the element that is lowest down on the page.
If you have no way to keep the lowest <div> safe, like "if(newDiv < lowest) lowest = newDiv", then I can't see a nice way to do it (without loop) :)
Try the code bellow, I didn't tested much... =/
Thanks!
I'll give it a try...
--
Dag.
"Jonas Raoni" <jo********@gma il.com> wrote in message
news:11******** **************@ g43g2000cwa.goo glegroups.com.. . Dag Sunde escreveu: And at some point, I want the x-coordinate of the bottom edge of the element that is lowest down on the page.
If you have no way to keep the lowest <div> safe, like "if(newDiv < lowest) lowest = newDiv", then I can't see a nice way to do it (without loop) :)
Try the code bellow, I didn't tested much... =/
function getLowestDown(t agName){ function getRect(o){ for(var r = {l: o.offsetLeft, t: o.offsetTop, w: o.offsetWidth, h: o.offsetHeight} ; o = o.offsetParent; r.l += o.offsetLeft, r.t += o.offsetTop); return r; }
var list = document.getEle mentsByTagName( tagName), i = list.length, lowest = i ? {o: list[0], r: getRect(list[0])} : {o: null, r: {l: 0, t: 0, w: 0, h: 0}}; for(var r = lowest.r, y = r.t + r.h; i; (r = getRect(list[--i])).t + r.h > y && (lowest = {o: list[i], r: r}, y = r.t + r.h)); return lowest; }
I have some difficulties rewriting your last loop...
In searching for lowest, can you help me to modify it, so
it skips the div with a specific id?
Like: if (list[i].id == 'footer')
// Don't count this as lowest...
TIA...
--
Dag.
Dag Sunde wrote: "Jonas Raoni" <jo********@gma il.com> wrote in message news:11******** **************@ g43g2000cwa.goo glegroups.com.. .
Dag Sunde escreveu:
And at some point, I want the x-coordinate of the bottom edge of the element that is lowest down on the page.
If you have no way to keep the lowest <div> safe, like "if(newDiv < lowest) lowest = newDiv", then I can't see a nice way to do it (without loop) :)
Try the code bellow, I didn't tested much... =/
function getLowestDown(t agName){ function getRect(o){ for(var r = {l: o.offsetLeft, t: o.offsetTop, w: o.offsetWidth, h: o.offsetHeigh t}; o = o.offsetParent; r.l += o.offsetLeft, r.t += o.offsetTop); return r; }
var list = document.getEle mentsByTagName( tagName), i = list.length, lowest = i ? {o: list[0], r: getRect(list[0])} : {o: null, r: {l: 0, t: 0, w: 0, h: 0}}; for(var r = lowest.r, y = r.t + r.h; i; (r = getRect(list[--i])).t + r.h > y && (lowest = {o: list[i], r: r}, y = r.t + r.h)); return lowest; }
I have some difficulties rewriting your last loop...
In searching for lowest, can you help me to modify it, so it skips the div with a specific id?
Like: if (list[i].id == 'footer') // Don't count this as lowest...
Using the above script and simplifying somewhat, try the version
below. There's no feature testing, required features may not be
supported on all browsers and it won't degrade gracefully if they aren't.
<!-- These divs won't be skipped -->
<div id="diva" style="height: 30px; border: 1px solid red;">diva</div>
<div id="divb" style="height: 30px; border: 1px solid red;">divb</div>
<div id="divc" style="height: 30px; border: 1px solid red;">divc</div>
<div id="divd" style="height: 30px; border: 1px solid red;">divd</div>
<!-- This div will be skipped -->
<div id="divz" style="height: 30px; border: 1px solid red;">divz</div>
<script type="text/javascript">
// Div id's not to include
var divsToSkip = {divx:0, divz:0};
function getLowestDown(t agName)
{
function getBottom(o)
{
var b = 0;
while (o.offsetParent ){
b += o.offsetTop;
b += o.offsetHeight;
o = o.offsetParent;
}
return b;
}
var list = document.getEle mentsByTagName( tagName);
var i = list.length;
var lowest = {o: null, b:0};
var t = {};
while (i--){
t = { o: list[i], b: getBottom(list[i])};
// Check if lower and if id is not in divs to skip
if ( t.b>lowest.b && !(t.o.id && (t.o.id in divsToSkip))) {
lowest.o = t.o;
lowest.b = t.b;
}
}
return lowest;
}
var x = getLowestDown(' div');
alert('Lowest: ' + x.o.nodeName + ' '
+ (x.o.id || '') + '\n'
+ 'Bottom: ' + x.b);
</script>
--
Rob
"RobG" <rg***@iinet.ne t.auau> wrote in message
news:43******** *************** @per-qv1-newsreader-01.iinet.net.au ... Dag Sunde wrote: "Jonas Raoni" <jo********@gma il.com> wrote in message news:11******** **************@ g43g2000cwa.goo glegroups.com.. .
Dag Sunde escreveu:
And at some point, I want the x-coordinate of the bottom edge of the element that is lowest down on the page.
<snippedvar list = document.getEle mentsByTagName( tagName), i = list.length, lowest = i ? {o: list[0], r: getRect(list[0])} : {o: null, r: {l: 0, t: 0, w: 0, h: 0}}; for(var r = lowest.r, y = r.t + r.h; i; (r = getRect(list[--i])).t + r.h > y && (lowest = {o: list[i], r: r}, y = r.t + r.h)); return lowest; }
I have some difficulties rewriting your last loop...
In searching for lowest, can you help me to modify it, so it skips the div with a specific id?
<snipped/> <script type="text/javascript">
// Div id's not to include var divsToSkip = {divx:0, divz:0};
function getLowestDown(t agName) { function getBottom(o) { var b = 0; while (o.offsetParent ){ b += o.offsetTop; b += o.offsetHeight; o = o.offsetParent; } return b; }
var list = document.getEle mentsByTagName( tagName); var i = list.length; var lowest = {o: null, b:0}; var t = {}; while (i--){ t = { o: list[i], b: getBottom(list[i])};
// Check if lower and if id is not in divs to skip if ( t.b>lowest.b && !(t.o.id && (t.o.id in divsToSkip))) { lowest.o = t.o; lowest.b = t.b; } } return lowest; }
This is almost perfect...
My problem is that this solution (getBottom(...) ) doesn't take into
consideration if o is absolute or relatively positioned.
The bottom line is that with the chaos of positioning in the page at hand,
the final lowest returned is added up to a too high value...
Any hints?
--
Dag.
Dag Sunde wrote:
[...] This is almost perfect...
My problem is that this solution (getBottom(...) ) doesn't take into consideration if o is absolute or relatively positioned.
The bottom line is that with the chaos of positioning in the page at hand, the final lowest returned is added up to a too high value...
Any hints?
Posting some (simple :-) ) test cases would help (or a link).
You may not be able to cover every situation, but you might be able to
cover a sufficient subset that suits your particular purpose (dang,
ain't alliteration grand!).
--
Rob This thread has been closed and replies have been disabled. Please start a new discussion. Similar topics |
by: Claudio Lapidus |
last post by:
Hello
Evidently is possible to have a negative time interval:
clapidus=> select interval '-1';
interval
-----------
-01:00:00
However, there seems to be no provision to get the absolute value in such
|
by: Michal Januszczyk |
last post by:
I have a very simple XML document.
<SmtpGatewayRules xmlns="http://www.foo.com/schema.xsd">
<rules>
<rule>
</rule>
</rules>
</SmtpGatewayRules>
When no xmlns is specified I can find rule element
with calling: SelectSingleNode("//rule");
|
by: Christopher Benson-Manica |
last post by:
I'm trying to compute the absolute value of an integer using only bitwise
operators...
int x;
sscanf( "%d", &x );
printf( "%d\n", (x^((~((x>>31)&1))+1)) + ((x>>31)&1) );
That works, but it assumes 32 bit integers. Is there a portable/standard way
to do this? Or are ANSI integers always 32 bits? If not, is using
sizeof(int) * 8 - 1 as the shift value an acceptable alternative?
|
by: Bill Nguyen |
last post by:
How do I get the absolute value of an expression in VB.NET? The new ABS
function looks scary to me!
Thanks
Bill
|
by: mike82y |
last post by:
I want to set da,db,dc to absolute value.. how do i do that??
many thanks
abs(da) = a - aaa;
abs(db) = b - bbb;
abs(dc) = c - ccc;
Mike
| |
by: cmay |
last post by:
I have a situation where I need a collection, where I can find the
VALUE (e.g. customer name) by it's key (ID value), AND also find the
ID value by the customer name.
Is there anything that does this?
|
by: dima69 |
last post by:
Hi all.
Here is a problem. I want to sort a form by absolute value. Let's say, if I have a field named "theSum", I'd like to set the form OrderBy property to "Abs()". If I use "Advanced filtering\sorting" from "Records" menu, it works just fine, and OrderBy proprty becomes "Abs()". But when I do the same thing manually or programmatically, it doesn't work.
So I cannot figure out what is the trick here and how to make this work.
|
by: Chad |
last post by:
I really don't understand how something like..
#define abs(x) (((x) < 0) ? -(x) : (x))
could cause a possible overflow.
|
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...
|
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.
Here is my compilation command:
g++-12 -std=c++20 -Wnarrowing bit_field.cpp
Here is the code in...
|
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...
| |
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...
|
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...
|
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...
|
by: adsilva |
last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
|
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.
| |