Question

Answer 1

尝试使用jquery：

window_size = $(window).height();

Answer 2

我喜欢这样做的方式是这样的三元作业。

 var width = isNaN(window.innerWidth) ? window.clientWidth : window.innerWidth;
 var height = isNaN(window.innerHeight) ? window.clientHeight : window.innerHeight;

我可能会指出，如果你在全局上下文中运行它，从那时起你可以使用window.height和window.width。

据我所知，在IE和其他浏览器上工作（我只在IE11上测试过它）。

超级清洁，如果我没有记错的话，效率很高。

Answer 3

这也应该有效。首先创建一个绝对位置和100％高度的绝对<div>元素：

<div id="h" style="position:absolute;top:0;bottom:0;"></div>

然后，通过offsetHeight

从该元素获取窗口高度

var winHeight = document.getElementById('h').offsetHeight;

<强>更新

function getBrowserSize() {
    var div = document.createElement('div');
    div.style.position = 'absolute';
    div.style.top = 0;
    div.style.left = 0;
    div.style.width = '100%';
    div.style.height = '100%';
    document.documentElement.appendChild(div);
    var results = {
        width: div.offsetWidth,
        height: div.offsetHeight
    };
    div.parentNode.removeChild(div); // remove the `div`
    return results;
}

console.log(getBrowserSize());

Answer 4

比一大堆if语句更简单。使用或（||）运算符。

function getBrowserDimensions() {
  return {
    width: (window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth),
    height: (window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight)
  };
}

var browser_dims = getBrowserDimensions();

alert("Width = " + browser_dims.width + "\nHeight = " + browser_dims.height);

Answer 5

我更喜欢我刚想通的方式......没有JS ...... 100％HTML＆amp; CSS：

（无论内容大小如何，都会在中间完美居中。

HTML文件

<html><head>
<link href="jane.css" rel="stylesheet" />
</head>
<body>
<table id="container">
<tr>
<td id="centerpiece">
123
</td></tr></table>
</body></html>

CSS文件

#container{
    border:0;
    width:100%;
    height:100%;
}
#centerpiece{
    vertical-align:middle;
    text-align:center;
}

对于在td中保持的图像/ div的居中，您可能希望尝试margin：auto;并指定div维度。 - 尽管如此......说＆＃39; text-align＆＃39;属性将不仅仅是一个简单的文本元素。

Answer 6

如果jQuery不是一个选项，

JavaScript版本。

window.screen.availHeight

Answer 7

var winWidth = window.screen.width;
var winHeight = window.screen.height;

document.write(winWidth, winHeight);

Answer 8

使用JQuery，你可以尝试这个$(window).innerHeight()（在Chrome，FF和IE上为我工作）。使用bootstrap模式，我使用了类似下面的内容;

$('#YourModal').on('show.bs.modal', function () {
    $('.modal-body').css('height', $(window).innerHeight() * 0.7);
});

10 个答案: