Hi T.J., I'm sorry for any confusion, but I was trying to get the dimension
of the browser window this whole time.  I misunderstood the <body> element
dimension as being the same thing as the browser window dimension.

- Paul K

On Thu, May 7, 2009 at 10:02 AM, Paul Kim <kimba...@gmail.com> wrote:

> Hi T.J., that is odd... I get the same results for the width and height of
> the <body> element using the code that Douglas gave me and Prototype's
> document.viewport.getDimensions(). You can take a look at my code at
> pastie.org: http://pastie.org/471309.  I don't know if it makes any
> difference, but I have tested the code on IE7, Firefox 3, Opera 9, and
> Safari 3 on my Windows Vista operating system.
>
> - Paul
>
>
> On Thu, May 7, 2009 at 9:54 AM, T.J. Crowder <t...@crowdersoftware.com>wrote:
>
>>
>> Hi Paul,
>>
>> Hmmm, that's not what it's documented to do.  Looking at the code,
>> it's clearly trying to give you the window dimensions, not the body
>> element.  Some browsers make that harder than others. :-)
>>
>> -- T.J.
>>
>> On May 7, 5:48 pm, Paul Kim <kimba...@gmail.com> wrote:
>> > Hi T.J., thanks for pointing me to document.viewport. It returns the
>> > dimensions of the <body> element.
>> >
>> > - Paul K
>> >
>> > On Thu, May 7, 2009 at 1:21 AM, T.J. Crowder <t...@crowdersoftware.com>
>> wrote:
>> >
>> > > Hi Paul,
>> >
>> > > > Thanks for the clear explanation regarding the viewport's height. I
>> did
>> > > > expect the body element's height to be the viewport's height...
>> >
>> > > You're not the first or only one to make that mistake. :-)
>> >
>> > > > ...I thought there was a simple method in Prototype
>> > > > that could easily determine the body element's width and height...
>> >
>> > > There is, and you used it:  getDimensions does that.  It's just that
>> > > the body's dimensions aren't what you thought they should be.  (And
>> > > again, you're not the only one, I think we've all been there.)
>> >
>> > > If you haven't looked at document.viewport[1] yet, it may be worth a
>> > > look, depending on what you're doing.
>> >
>> > > [1]http://prototypejs.org/api/document/viewport
>> >
>> > > HTH,
>> > > --
>> > > T.J. Crowder
>> > > tj / crowder software / com
>> > > Independent Software Engineer, consulting services available
>> >
>> > > On May 6, 8:46 pm, Paul Kim <kimba...@gmail.com> wrote:
>> > > > Hi T.J.,
>> >
>> > > > Thanks for the clear explanation regarding the viewport's height. I
>> did
>> > > > expect the body element's height to be the viewport's height and I
>> was
>> > > wrong
>> > > > to make that assumption.  Since Prototype javascript library seems
>> to
>> > > iron
>> > > > out various cross-browser implementations of native javascript
>> (Internet
>> > > > Explorer in particular), I thought there was a simple method in
>> Prototype
>> > > > that could easily determine the body element's width and height.
>> >
>> > > > - Paul K
>> >
>> > > > On Wed, May 6, 2009 at 2:05 AM, T.J. Crowder <
>> t...@crowdersoftware.com>
>> > > wrote:
>> >
>> > > > > Hi Paul,
>> >
>> > > > > Just to add to that, I'm guessing the height was "wrong" because
>> you
>> > > > > were expecting the body element's height to be the viewport's
>> height.
>> > > > > The body element's height is determined by its content (barring
>> CSS
>> > > > > rules to the contrary), not the height of the viewport.  Try this
>> CSS:
>> >
>> > > > > body {
>> > > > >    border:           1px solid red;
>> > > > > }
>> >
>> > > > > ...with this body:
>> >
>> > > > > <body>
>> > > > > <p>This is a test</p>
>> > > > > </body>
>> >
>> > > > > ...and you'll see the red border around the (outside of the)
>> > > > > paragraph, not around the entire page viewport.  If you ask its
>> > > > > dimensions, you'll find the body is 40-50px high depending on your
>> > > > > font sizes, etc.  If you have lots of content in the body, such
>> that
>> > > > > it fills or overfills the viewport, the red border is (of course)
>> > > > > around all of the content.
>> >
>> > > > > You were probably expecting the body to be at least the height of
>> the
>> > > > > viewport, perhaps because some CSS rules are applied as if that
>> were
>> > > > > true.  Add a background color, for instance:
>> >
>> > > > > body {
>> > > > >    border:           1px solid red;
>> > > > >    background-color: yellow;
>> > > > > }
>> >
>> > > > > ...and the yellow background fills the viewport, even though the
>> body
>> > > > > doesn't.
>> >
>> > > > > Fun, eh?
>> > > > > --
>> > > > > T.J. Crowder
>> > > > > tj / crowder software / com
>> > > > > Independent Software Engineer, consulting services available
>> >
>> > > > > On May 5, 5:25 pm, Paul Kim <kimba...@gmail.com> wrote:
>> > > > > > Thank you, Douglas. Works like a charm!
>> >
>> > > > > > - Paul K
>> >
>> > > > > > On Tue, May 5, 2009 at 9:19 AM, Douglas <
>> douglas.gont...@gmail.com>
>> > > > > wrote:
>> >
>> > > > > > > I hope this snippet helps :o)
>> >
>> > > > > > > [code]
>> > > > > > >    var w = 0,
>> > > > > > >        h = 0;
>> >
>> > > > > > >    if (typeof(window.innerWidth) == 'number') {
>> > > > > > >        w = window.innerWidth;
>> > > > > > >        h = window.innerHeight;
>> > > > > > >    } else if (document.documentElement &&
>> > > > > > > (document.documentElement.clientWidth ||
>> >
>> > > > > > > document.documentElement.clientHeight))
>> > > > > > >    {
>> > > > > > >        //IE 6+ in 'standards compliant mode'
>> > > > > > >        w = document.documentElement.clientWidth;
>> > > > > > >        h = document.documentElement.clientHeight;
>> > > > > > >    } else if (document.body && (document.body.clientWidth ||
>> > > > > > >                                 document.body.clientHeight))
>> > > > > > >    {
>> > > > > > >        //IE 4 compatible
>> > > > > > >        w = document.body.clientWidth;
>> > > > > > >        h = document.body.clientHeight;
>> > > > > > >    }
>> > > > > > > [/code]
>> >
>> > > > > > > On Tue, May 5, 2009 at 1:14 PM, kimbaudi <kimba...@gmail.com>
>> > > wrote:
>> >
>> > > > > > > > Hi, I am unable to get the height of the <body> tag using
>> > > > > > > > Element.getDimensions although I can get the width of the
>> <body>
>> > > tag
>> > > > > > > > fine. How can I get the height of the <body> tag? I have my
>> > > simple
>> > > > > > > > code pasted athttp://pastie.org/468828. Here is the snippet
>> of
>> > > code
>> > > > > > > > below as well:
>> >
>> > > > > > > > function alertBodyDim() {
>> > > > > > > >       /* $('main') refers to <body id="main"> */
>> > > > > > > >        var dimensions = $('main').getDimensions();
>> > > > > > > >        alert(dimensions.width);
>> > > > > > > >        alert(dimensions.height);
>> >
>> > > > > > > > }
>> >
>> > > > > > > > - Paul K
>> >
>> > > > > > > --
>> > > > > > > Believe nothing, no matter where you read it, or who said it,
>> no
>> > > > > > > matter if I have said it, unless it agrees with your own
>> reason and
>> > > > > > > your own common sense. ~Buddha
>> >
>> >
>> >>
>>
>

--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups 
"Prototype & script.aculo.us" group.
To post to this group, send email to prototype-scriptaculous@googlegroups.com
To unsubscribe from this group, send email to 
prototype-scriptaculous+unsubscr...@googlegroups.com
For more options, visit this group at 
http://groups.google.com/group/prototype-scriptaculous?hl=en
-~----------~----~----~----~------~----~------~--~---

Reply via email to