how do I get a consistent javascript window.outerHeight cross browser?

问题

Maybe this is a noob question but...

I have a site where I want the footer to appear in the same place all the time. Assuming my users are all on >= IE8, Chrome and Firefox I figured it was just a question of getting the Window.outerHeight.

But when I measure the window.outerHeight it returns different values in FF v. Chrome v. IE.

Plus, just doing some basic measurements visually, it's clear that a 500px DIV is not the same height on my monitors in Chrome as in FF as in IE.

SO: Is there some 'formula' one can reliably use to convert pixel size cross browser so that one can set a proper 'max-height' for a certain div and know it will be the same height in my monitor on IE, Chrome and FF?

Again... I'm not really concerned about truly 'universal'. 99% of my users will have those 3 browsers so if I can get those OK, I'd be more than happy.

TIA,

---JC

回答1:

for IE8 you could use document.body.offsetHeight.

but I would suggest to use only CSS:

<div id="footer" style="position: fixed; bottom: 0;"></div>

(example: http://jsfiddle.net/5h8zj/)

来源：https://stackoverflow.com/questions/14076650/how-do-i-get-a-consistent-javascript-window-outerheight-cross-browser