"为什么 window.innerWidth 不返回正确的值？"

Question

我正在尝试解决使用 Javascript 来确定浏览器“窗口”宽度的问题。 我知道在这种情况下，不同的人可能意味着不同的东西，所以具体来说，我指的是绿色区域，如本文中所示<\/a>。

我已经阅读了对该帖子的前两个回复以及针对此问题的许多其他 stackoverflow 解决方案，但我都无法开始工作：我正在使用 Firefox 27.0.1，在 1920 像素宽的显示器上最大化窗口. 脚本说我的视口是 1536 像素宽。 我预计是 1920 年（或接近 1920 年）。

根据我所看到的，在我看来，最简单的解决方案是这段代码：

<html>
<head>
<script type="text/javascript">
function onAfterLoad() {
    document.write('<p>Your viewport width is '+window.innerWidth+'</p>');
}
</script>
</head>
<body onload="onAfterLoad();">
</body>
</html>

Answer 1

我认为你应该尝试使用jQuery Dimension Functions。 而是处理Javascript函数。

最基本的是

$(window).width() （获取浏览器的宽度）

和

$(window).height() （获取浏览器的高度）

希望这可以帮助。

Answer 2

对我来说，这个问题是浏览器缩放的结果。 尝试控制+滚轮，看看这是否会改变你得到的结果。 如果是，请参阅如何在所有现代浏览器中检测页面缩放级别？

Answer 3

检查您的视口元标记。 它应该是：

<meta name="viewport" content="width=device-width,initial-scale=1" />

Answer 4

首先：
你确定这是你的视口宽度吗？ 您想获得浏览器窗口或整个屏幕的宽度吗？ 如果你想获得整个屏幕的宽度，这在JavaScript中是不可能的。
其次：
试试这个来获取浏览器窗口的宽度：

function GetWidth()
{
var width = document.body.clientWidth;
document.write('<p>Your viewport width is '+width+'</p>')
}

Answer 5

如果您将Microsoft Windows 7配置为显示大25％的文本，则Firefox会将您的屏幕报告为实际大小的1 / 1.25倍。 对于实际的1920年，这正好是1536。

（即使画布中的矩形也被画得太大了25％。去过那里，疯了。）

Answer 6

windows 11机器解决方案<\/strong>
转到设置 > 显示 > 缩放和布局，并将其更改为 100%，
之后你应该看到屏幕分辨率作为你的代码输出，
注意：不建议这样做，因为您会遇到难以阅读的文本大小。
解释<\/strong>
一些系统（如 Windows）会缩放应用视口，这是因为现在屏幕每英寸的像素值更密集，所以文本会很小。
为了更深入地了解，想象一个典型的笔记本电脑屏幕宽度为 14 英寸，宽度为 1920 像素。
如果您将字体设置为 20px，那么您的文本将具有以下大小：
text-size-in-inch = font-size-in-pixel * screen-width-in-inch \/ screen-pixels。
因此，如果您进行数学运算，它将是：
英寸文本大小 = 20 * 14 \/ 1920 = .1458333... 英寸。
所以它真的非常小，因此系统倾向于将这些屏幕缩放 125%，也就是说，在你的情况下，你的屏幕宽度将是 = 1920 \/ 125% = 1536 px
推荐<\/strong>
您应该调整您的代码以使用任何屏幕分辨率

"

Answer 7

你的代码适合我。 它说1600（我有一个1600 x 900的屏幕）。 调用代码时，浏览器是否最大化？ 也许你的分辨率是1536 x的东西，你的屏幕拉伸了吗？ 我会在你的屏幕设置中查看它。 另一种尝试方法是打开Chrome和Devtools，然后调整浏览器的大小。 它将显示浏览器窗口尺寸。

"为什么 window.innerWidth 不返回正确的值？"

问题描述

7 个解决方案

解决方案1
3 2014-03-01 10:43:20

解决方案2
3 2016-10-06 01:17:07

解决方案3
1 2016-02-29 18:10:50

解决方案4
0

解决方案5
0 2014-06-05 01:02:02

解决方案6
0 2022-01-31 08:06:51

解决方案7
-1 2014-03-01 12:38:21

"为什么 window.innerWidth 不返回正确的值？"

问题描述

7 个解决方案

解决方案1 3 2014-03-01 10:43:20

解决方案2 3 2016-10-06 01:17:07

解决方案3 1 2016-02-29 18:10:50

解决方案4 0

解决方案5 0 2014-06-05 01:02:02

解决方案6 0 2022-01-31 08:06:51

解决方案7 -1 2014-03-01 12:38:21

解决方案1
3 2014-03-01 10:43:20

解决方案2
3 2016-10-06 01:17:07

解决方案3
1 2016-02-29 18:10:50

解决方案4
0

解决方案5
0 2014-06-05 01:02:02

解决方案6
0 2022-01-31 08:06:51

解决方案7
-1 2014-03-01 12:38:21