Re: Viewport Dimensions

"diego nunes" <[email protected]> Wed, 6 Sep 2006 17:34:02 -0300
Newsgroups gmane.comp.web.dom.wdf
Message-ID <[email protected]>
On 9/6/06, Gale, David <[email protected]> wrote:
>  1) Create a div that's as tall & as wide as the entire page, set to 90%
>  opacity, to make it clear what's being worked on without totally hiding
>  the current data.
>  2) In that div, create a div that's centered horizontally & vertically
>  in the visible section of the page, which contains the popup controls.
    You mean, a pseudo-modal window, right?

    The approach of getting the biggest value between offsetHeight and
scrollHeight looks ok, but you should do some cross-browser
validation. If Firefox, for example, you should look at
document.documentElement.offsetHeight, instead. There is a good
compatibility table showing the properties and values in each browser
at <http://www.quirksmode.org/viewport/compatibility.html>


> in IE is taller than need be when the actual page is
>  smaller than the viewport
    IE and scrollbars are always causing some kind of trouble. You can
try different measures of width and height, but it probably won't
solve everything, always.
    Sometimes it's so weird that elements with 100% width stays a
bunch pixels distant form the right margin of the page, 'cause IE
somehow _reserves_ the space for the scrollbar.
    When I have to fill the whole page, I set a class in <body>
element, that activate a selector that says "overflow-x: hidden;" and
that's it. But with overflow-y you can try other measurements, indeed.
It's probably _solvable_ easily.

    To position the pseudo-window vertically, you'll have to know how
far from the top the scroll is (sometimes from window.pageYOffSet,
seomtimes from document.documentElement.scrollTop) and then add it to
the half of the viewport height.
    In an ideal world, you would be able to use "position: fixed;" and
then just set the element to (pageHeight /2 + pseudoWindowHeight/2).
But not in this one, with IE in it, that simply deny to apply
"position: fixed;" correctly.

    Anyway, if you put your code -- or at least the idea of it --
online, we'll surely be able to help much more.

  Amplexos.

--
diego nunes
dnunes.com


Unsubscribe
[email protected]

List info
http://www.quirksmode.org/dom/list.html 
Yahoo! Groups Links

<*> To visit your group on the web, go to:
    http://groups.yahoo.com/group/wdf-dom/

<*> To unsubscribe from this group, send an email to:
    [email protected]

<*> Your use of Yahoo! Groups is subject to:
    http://docs.yahoo.com/info/terms/