Question

在Android Chrome上，当打开新标签页并导航到某个网址时，或者当您放大页面然后导航到新的网址时，window.outerWidth和偶尔（document.documentElement.clientWidth）并不总是准确的价值观。在最多3秒后，他们获得准确的值。是否有来自窗口或DOM的相应事件我可以监听以检测此时刻，还是我必须依赖循环？

以下是问题的演示：http://betterstatistics.org/tests/load.html 我只在Android Chrome上看过这个，也许是个bug？

以下是行为存在时从该页面获得的输出。请注意，window.outerWidth（OW）等于0到1100ms：

body onload()
-0ms CW: 980 IW: 980 OW: 0
-100ms CW: 980 IW: 980 OW: 0
-200ms CW: 980 IW: 980 OW: 0
-300ms CW: 980 IW: 980 OW: 0
-400ms CW: 980 IW: 980 OW: 0
-500ms CW: 980 IW: 980 OW: 0
-600ms CW: 980 IW: 980 OW: 0
-700ms CW: 980 IW: 980 OW: 0
-800ms CW: 980 IW: 980 OW: 0
-900ms CW: 980 IW: 980 OW: 0
-1000ms CW: 980 IW: 980 OW: 0
-1100ms CW: 980 IW: 980 OW: 384
-1200ms CW: 980 IW: 980 OW: 384
-1300ms CW: 980 IW: 980 OW: 384

以下是测试页面的HTML：

<html>
<head>
<script>
  var count = 0;
  var interval = 100;
  function init(){
    log("body onload()");
    outputStats();
  }
  function outputStats() {
    log("-" + (count * interval) + "ms  CW: " + 
    document.documentElement.clientWidth+"  IW: "+window.innerWidth+"  OW: " +window.outerWidth);
    count++
    if(count < 50){
      setTimeout(outputStats, interval);
    }
  }
  function log(t){
    var logDiv = document.getElementById("content");
    var tDiv = document.createElement("div");
    tDiv.appendChild(document.createTextNode(t));
    logDiv.appendChild(tDiv);
  }
</script>
</head>
<body onload="init();" style="font-family:sans-serif;">
  <div id="content">
    Using Android Chrome: open this page in a new tab, or go to another web page then scale it up, and navigate to this page. The window.outerWidth does not show the correct value for up to a few seconds.<br/>
    <br/>
    CW: document.documentElement.clientWidth<br/>
    IW: window.innerWidth<br/>
    OW: window.outerWidth<br/>
    <br/>
  </div>
</body>
</html>

是否有一个事件告诉您window.outerWidth何时成为准确值？

0 个答案: