Thanks for your input, your demo is actually working better than what
I came up with, I'm gonna look into it and see if I can use it.
Absolute positioning would normally work but not in my case. This
function is to be a part in a web based user interface for a very
large business application, and the html framework includes a
gazillion positioned elements to make the app stretch to the whole
viewport, and it has a collapsible left search and menu section, so
absolute positioning would mess with a lot of other stuff...
This is actually a holder for a search result table, where the table
header is fixed and the body is scrolling, and I cannot set any
heights or widths manually. Widths do themselves pretty good, but in
order to get a pixel hiehgt value that would go from the start of the
table and take up the rest of the viewport, this is the way to go. I'm
also setting the table width to the div's auto width minus 20px to
accommodate for the scrollbar.
Also, I use a similar function for Firefox, but since firefox scrolls
the tbody element nicely if you set it to a fixed height, I target
that instead. And since FF stretches the tbody to this fixed height
even if there's too few rows, I have to compare the actual height
with:
$("tbody").height() with the full viewport height which is window
height minus top offset minus thead height and a bogus tfoot div
height and 20px bottom spacer. Which ever is the lowest vaule is
applied to the tbody, works like a charm :-))
All left now is the left search/menu collapse coltroller for this and
Im all set. Thanks again for your help!
/Torgil - kabelkultur.se
On 30 Sep, 21:06, rolfsf <[EMAIL PROTECTED]> wrote:
> I might add that you may be able to accomplish the same thing in
> 'modern' browsers (e.g. not IE6) with just css, using absolute
> positioning. Just set your right, left and bottom to, for example,
> 10px. (IE6 can't handle positioning on 3 sides).
>
> On Sep 30, 11:58 am, rolfsf <[EMAIL PROTECTED]> wrote:
>
>
>
> > Glad you solved it. I actually had a mistake in my last line, but
> > here's a working version:
>
> >http://www.monkeypuzzle.net/testfiles/jquery/divSize.htm
>
> > I added a window resize function so it always adapts to the window. As
> > you can see, nothing is absolutely positioned, and I threw a mixture
> > of elements above the div I wanted to size, just to confirm that it
> > really doesn't care what's there - it's measuring the offset from the
> > top of the window.
>
> > On Sep 30, 3:26 am, Kabelkultur Gotland <[EMAIL PROTECTED]> wrote:
>
> > > Well, I managed to solve it.
>
> > > Using option relativeTo for the offset and setting the relativeTo to
> > > use my header div that is always present, and always absolutely
> > > positioned at top:0;
>
> > > Now I have a div that takes up whatever space is left down to bottom
> > > of viewport, just like I wanted. Thanks for all help!
>
> > > On 30 Sep, 10:18, Kabelkultur Gotland <[EMAIL PROTECTED]> wrote:
>
> > > > Well, thanks, but it turns out that it does exactly the same as my own
> > > > function.
> > > > If I have a div above it with a SET TOP position, e.g. css: top:0; -
> > > > or whatever - it works.
> > > > But if I don't have nothing but a bunch of <br/> tags above the div,
> > > > or if I set the div above to psition:relative and remove the set top
> > > > position, it doesn't work anymore.
> > > > I really need some way to get the top offset for my div from the top
> > > > edge of the window, no matter what may or may not be above the div in
> > > > the DOM tree, and so far no luck.
> > > > But thanks for the effort, I appreciate it.
>
> > > > /Torgil
>
> > > > On 29 Sep, 21:26, rolfsf <[EMAIL PROTECTED]> wrote:
>
> > > > > try this:
>
> > > > > var wh = $(window).height(); // window
> > > > > height
> > > > > var mt = $('#myDiv').offset().top; //
> > > > > top position of #myDiv
>
> > > > > $(mt).css('height', wh - mt - 20 + 'px'); //
> > > > > set height of #myDiv
>
> > > > > On Sep 29, 8:33 am, Kabelkultur Gotland <[EMAIL PROTECTED]> wrote:
>
> > > > > > Well, the $(window).height() gets the height for me.
>
> > > > > > What I need is something to measure the distance from the window top
> > > > > > and down to the element top.
> > > > > > And then subtract it from the window height, minus another 20 pix ad
> > > > > > use that value as height for the div.
>
> > > > > > If the window is 1000 px high, and the div starts 300px down, I'd
> > > > > > like
> > > > > > to get 100 - 300 - 20 = 680
> > > > > > And then apply this as height for the div.
>
> > > > > > And this needs to be done without mixing in other elements that
> > > > > > might
> > > > > > or might not be part of the dom tree between the window top and the
> > > > > > elements top position.
>
> > > > > > So I guess that the problem lies within the second measuring
> > > > > > parameter
> > > > > > of my function:
> > > > > > $ (".tableHolder").offset().top - this for some reason uses other
> > > > > > positioned elements for its calculation, and I need it not to.
>
> > > > > > Regards, Torgil - kabelkultur.se- Dölj citerad text -
>
> > > > > - Visa citerad text -- Dölj citerad text -
>
> > > > - Visa citerad text -- Dölj citerad text -
>
> - Visa citerad text -
