Suggestion FAQ 4.9

[dhtml]

4.9 How do I find the size of the window/browser canvas area?

The answer is completely wrong and the example code is not cross
browser.

innerWidth is not the same as documentElement.clientWidth. innerWidth
includes scrollbar, clientWidth doesn't. This is a mistake I see all
over the web and I bet there are people who got that from
c.l.javascript FAQ.

The correct answer is:
It is not possible to accurately determine the width of the canvas
area, cross browser. There are various non-standard properties that
may provide some information about the viewport, but they differ
between browsers, versions, and rendering modes, so it is difficult to
accurately determine if the value can be relied upon.

| Where supported in modern browsers:
|
| var winWidth = document.documentElement.clientWidth;
| var winHeight = document.documentElement.clientHeight;

This won't work reliably. In Opera 9, documentElement.clientHeight
won't return the window height. Instead, it will return the
clientHeight of the documentElement (the HTML HTMLElement). Opera
seems to return the viewport height (no scrollbars) for
document.body.clientHeight, for no apparent reason. I would call this
a bug.

The buggy code should be removed from the FAQ.

Garrett

 

[dhtml]

I see RobG's post in response to my other FAQ Entry comment, but lets
open this up for discussion. I know David Mark did a good deal of
research on this topic. (And I don't think he used the code in the
FAQ).

Garrett

 

[David Mark]

4.9 How do I find the size of the window/browser canvas area?

The answer is completely wrong and the example code is not cross
browser.

innerWidth is not the same as documentElement.clientWidth. innerWidth
includes scrollbar, clientWidth doesn't. This is a mistake I see all
over the web and I bet there are people who got that from
c.l.javascript FAQ.

It is a mistake.

The correct answer is:
It is not possible to accurately determine the width of the canvas
area, cross browser. There are various non-standard properties that
may provide some information about the viewport, but they differ
between browsers, versions, and rendering modes, so it is difficult to
accurately determine if the value can be relied upon.

I agree.

| Where supported in modern browsers:
|
| var winWidth = document.documentElement.clientWidth;
| var winHeight = document.documentElement.clientHeight;

This won't work reliably. In Opera 9, documentElement.clientHeight
won't return the window height. Instead, it will return the
clientHeight of the documentElement (the HTML HTMLElement). Opera
seems to return the viewport height (no scrollbars) for
document.body.clientHeight, for no apparent reason. I would call this
a bug.

Yes. Opera has a bug with clientHeight, but oddly clientWidth is
okay. That was 9.0 and I think they have a new one out since then.

The buggy code should be removed from the FAQ.

Perhaps. It was discussed a while back and determined that a true
cross-browser solution is too involved for a FAQ entry.

 

[David Mark]

I see RobG's post in response to my other FAQ Entry comment, but lets
open this up for discussion. I know David Mark did a good deal of
research on this topic. (And I don't think he used the code in the
FAQ).

That is correct. The example I referred to at the time is still on
Google code:

http://code.google.com/p/niceshowcase/

At the time it was accurate in all but Opera (and possibly older
versions.) In that browser, if there were was no vertical scrollbar,
the measurement used was the clientHeight of the documentElement.
With a vertical scrollbar, all sorts of messy calculations had to be
done to get the height. The same was not true for the width.
Hopefully, they fixed this stuff in 9.5.

If it wasn't for Opera's troubles, it would be possible to cover this
in a FAQ entry.

 

[Peter Michaux]

[snip]

The buggy code should be removed from the FAQ.

The FAQ is currently not being modified so. Randy Webb did an
admirable job for a while but some time ago suggested it might be good
if someone else took over as FAQ maintainer.

For now it seems following the instructions in the FAQ is a way to
possibly ensure suggestions are revisited in the future

http://jibbering.com/faq/#FAQ5_1

Peter

 

[dhtml]

That is correct. The example I referred to at the time is still on
Google code:

http://code.google.com/p/niceshowcase/

At the time it was accurate in all but Opera (and possibly older
versions.) In that browser, if there were was no vertical scrollbar,
the measurement used was the clientHeight of the documentElement.
With a vertical scrollbar, all sorts of messy calculations had to be
done to get the height. The same was not true for the width.
Hopefully, they fixed this stuff in 9.5.

If it wasn't for Opera's troubles, it would be possible to cover this
in a FAQ entry.

I have updated the FAQ Entry. As JR Stockton points out, it is now quite
long, and should become a note.

http://jibbering.com/faq/#getWindowSize

It might be possible to shorten it, or move it to a "notes" article. I
did not want to hand-wave the feature testing and strategization that is
necessary to solving this sort of problem.


Garrett

 

[Erwin Moller]

dhtml schreef:

I have updated the FAQ Entry. As JR Stockton points out, it is now quite
long, and should become a note.

http://jibbering.com/faq/#getWindowSize

It might be possible to shorten it, or move it to a "notes" article. I
did not want to hand-wave the feature testing and strategization that is
necessary to solving this sort of problem.

Don't shorten it.
In general, people who look up something in the FAQ are motivated to
find answers quickly. A few extra lines or examples never hurt when it
clearifies the subject at hand.

Just my 2 cent.

Regards,
Erwin Moller

Garrett

--
============================
Erwin Moller
Now dropping all postings from googlegroups.
Why? http://improve-usenet.org/
============================