好了，所以，我所面临的问题是这样的：我的手机火狐浏览器不检索正确的价值观window.innerWidth，document.documentElement.clientWidth，的甚至宽度div风格的页面加载后，占据整个客户端窗口。
我并不疯，我的代码在其他浏览器中也能正常工作！出于某种原因，Firefox会使用默认值初始化这些值，然后在以后获取正确的值。如果在任何时候我用中断我的JavaScript alert()，这些属性将在之后变得神奇起来准确。
我在互联网上搜寻了一个答案，我只能找到一种解决方法：用于window.setTimeout延迟使用这些属性，直到它们有时间正确填充为止。这很疯狂！用户想要速度，而不仅仅是为了在Firefox浏览器上查看我的网站而额外的延迟。
我不明白的是，我可以div在数值变得准确之前进行设置以完全填充客户端窗口。我通过将div ID的宽度和高度设置为100％在CSS中进行此操作。document.documentElement与document.getElementById("my_div");所有文档元素都加载后基本相同，因此，如果浏览器div最初没有正确的客户端窗口尺寸，浏览器如何知道应该有多大？
我尝试在a中运行我的代码，window.addEventListener("load",function(event_){ //My Code });但是仍然不会生成这些值。之后是否有页面加载事件window.onload？
如果有人能告诉我为什么只有Firefox移动版似乎表现出这种奇怪的行为，那么我将给您带来最高的5分。
以下是一些用于重现问题的示例代码：
<!DOCTYPE HTML>
<html>
<head>
<!-- Added " after javascript during edit. -->
<script type="text/javascript">
window.addEventListener("load",function(event_){
var output=document.getElementById("output");
/* Returns some default value like 980. */
output.innerHTML=window.innerWidth;
alert("After this alert, the value will change.");
/* Returns an accurate value like 511. */
output.innerHTML=window.innerWidth;
});
</script>
<!-- Added title during edit. -->
<title>Title</title>
</head>
<body>
<p id="output">Default Output</p>
</body>
</html>
我的Firefox Android版是35.0.1。我的Android版本是4.4.4。在我的设备上，Firefox在输出p元素中显示“ 980”，显示警报，然后再次显示“ 980”。页面刷新后，前两个步骤保持不变，但是警报后的输出更改为360 document.documentElement.clientWidth。我尝试的任何属性似乎都无法获得正确的值。Firefox在页面加载后似乎有某种延迟，才能访问客户端窗口的尺寸...
我在没有JQuery的情况下尝试了verge.airve.com插件，它的初始反馈保持在980。在Chrome上它也初始化为980，这很奇怪，因为没有它，Chrome可以按预期工作...
经过大量辩论，找到了解决方案！Firefox加载后显然会调整窗口的大小（我想是很不错的选择，谁确实知道）！因此，通过在window.onload之外添加一个调整大小的事件处理程序，可以避免此问题！有关更多详细信息，请参见下面的接受的答案。
装入整个文档并调整大小后，请确保完成测量。
window.onload = showViewport;
window.onresize = showViewport;
function showViewport() {
var output=document.getElementById("output");
var width = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);
var height= Math.max(document.documentElement.clientHeight, window.innerHeight || 0)
output.innerHTML = "Viewport size is " + width + "x" + height;
}<body>
<p id="output">Default Output</p>
</body>本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句