How do I get the current height and width of the available space in the browser as it is open.
I don't want the height of the total document, just what's visible on the screen.
可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效，请关闭广告屏蔽插件后再试):
问题:
回答1:
You can take a look at this blog post to see the method.
and in short in give that code
function alertSize() {
var myWidth = 0, myHeight = 0;
if(typeof(window.innerWidth) == 'number') {
// Non-IE
myWidth = window.innerWidth;
myHeight = window.innerHeight;
}
else if(document.documentElement && (document.documentElement.clientWidth || document.documentElement.clientHeight)) {
// IE 6+ in 'standards compliant mode'
myWidth = document.documentElement.clientWidth;
myHeight = document.documentElement.clientHeight;
}
else if(document.body && (document.body.clientWidth || document.body.clientHeight)) {
// IE 4 compatible
myWidth = document.body.clientWidth;
myHeight = document.body.clientHeight;
}
window.alert( 'Width = ' + myWidth );
window.alert( 'Height = ' + myHeight );
}
also have to be noted that most of js framework (jquery, ext, prototype) would provide a function for doing that (IMHO).
in jQuery:
$(window).width();
$(window).height();
回答2:
Use the window objects property, inner height/width, to find the dimensions of just the content on the webpage. This includes the scroll bars. Here is a visual explanation -> http://goo.gl/L0cBLA.
Height:
window.innerHeight
Width:
window.innerWidth
回答3:
<html id="THE_HTML">
<!-- all your stuff... -->
</html>
then:
document.getElementById('THE_HTML').clientHeight;
Tested and working under IE8 and FF3.6...
