js - 以像素为单位获取客户端的窗口尺寸（显示器分辨率）

Question

为了设计一个精确的网络界面，我需要在访问我的网页时使用javascript获得客户端的显示器分辨率。这可能吗？

Answer 1

对于您的问题的简单回答，只需查看 screen.height 或 screen.width.

e.g。

<强> window.screen.height

<强> window.screen.width

对于浏览器维度，您只需使用 window.height 或 window.width

如果您正在考虑根据可用空间改变设计/布局，您希望查看 media queries 或使用类似Bootstrap的框架，{{ 3}}或Foundation会对 Skel.js 引入更易于控制的控制权。

  

媒体查询是一个CSS3模块，允许内容呈现适应   屏幕分辨率等条件（例如智能手机与高分辨率   定义屏幕）。它于2012年6月成为W3C推荐标准。   并且是响应式网页设计的基石技术。

[...]

  

响应式网页设计（RWD）是一种旨在制作的网页设计方法   网站提供最佳的观看体验 - 易于阅读和   导航，最小化调整大小，平移和滚动   各种设备（从手机到台式电脑）   监视器）

Answer 2

这是一段代码：

 document.write("Available Width: " + screen.availWidth);
document.write("Available Height: " + screen.availHeight);

来源：http://www.w3schools.com/js/js_window_screen.asp

无法发表评论，但这里是浏览器高度的解决方案：

window.innerHeight/Width

由大多数浏览器提供，但不是Internet Explorer 8-，甚至在Internet Explorer 9+中提供，它在怪癖模式下不可用。

document.body.clientHeight/Width

由许多浏览器提供，包括Internet Explorer。

document.documentElement.­clientHeight/Width

由大多数DOM浏览器提供，包括Internet Explorer。

资料来源： http://www.howtocreate.co.uk/tutorials/javascript/browserwindow