StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PODetect actual web page size in Google Chrome
text
Body
copied!<p>I need to find a way to get actual page size in Google Chrome. In other browsers this can be easily done with window.scrollMaxY. Chrome does not support this property. All proposed workrounds, which I found so far, do not work as expected. Here is a simple test page (insert this into empty html/body element):</p> <pre><code><input type="button" name="size" value="size" onclick="alert(window.scrollMaxY)"> <div id="content" style="width:300px;height:500px;background-color:green"></div> </code></pre> <p>We have a div with height 500. In FireFox, no matter what is the size of the browser window, the code returns actual height of the page, that is 500 + some value for margins and the button. In Chrome we need to replace <code>window.scrollMaxY</code> with something. I've tried all mentioned on the Net properties (document.body, document.documentElement, window.getComputedStyle, and others), but no one returns actual height of the document, <strong>when Chrome window is larger than the document</strong>: in this case any property provided by Chrome returns the height of the window, not the height of the page. For example, if we have a screen with 768 pixels height, and Chrome window maximized, Chrome will report the page height about 700, not 500. So the question is, how to get actual page size in Chrome. Feel free to test your propositions with the specified test page, replacing the alert's parameter with any necessary stuff.</p> <p>Self-answer:</p> <p>After deeper investigation I found that the cause of the problem is the web-page itself, specifically the missing DOCTYPE tag in the beginning of the page. Without the DOCTYPE Chrome works in a different mode, and expands the body to entire window (as zapthedingbat wrote in his answer). So, the proper web-page markup may solve the problem, but it is only possible in the cases when the pages are our own pages. For other peoples' web-pages from Internet, which may have no DOCTYPE, the problem will persist. As I need to deel with external web-pages, I'll need to solve this somehow, but this is another question.</p> <p>I hope this info may be helpful for others who stumble on the same issue and can't figure out the reason.</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload