clientWidth和clientHeight在Android默认浏览器上延迟？

我使用jqtouch.js（与zepto.js）和测试 onorientationchange事件：使用默认的Android浏览器这个页面我得到的clientWidth和clientHeight数字颠倒clientWidth和clientHeight在Android默认浏览器上延迟？

http://www.ebi.ac.uk/~mp/test_orientation.html 

<!DOCTYPE html> 
<meta charset="utf-8"> 
<html> 
    <head> 
    <!-- Local jqTouch --> 
    <link rel="stylesheet" href="lib/jqtouch-1.0-b4-rc/themes/css/apple.css" title="jQTouch"> 
    <!-- <style type="text/css" media="screen">@import "lib/jqtouch-1.0-b4-rc/themes/css/jqtouch.css";</style> --> 
    <script src="lib/jqtouch-1.0-b4-rc/src/lib/zepto.min.js" type="text/javascript" charset="utf-8"></script> 
    <script src="lib/jqtouch-1.0-b4-rc/src/jqtouch.js" type="text/javascript" charset="utf-8"></script> 

    <script type="text/javascript" charset="utf-8"> 
     var jQT = new $.jQTouch({}); 
    </script> 

    </head> 
    <body> 
    <h1>Hello World</h1> 
    <script> 
     window.onorientationchange = function() { 
     var w = document.documentElement.clientWidth; 
     var h = document.documentElement.clientHeight; 
     alert("WIDTH: " + w + " -- HEIGHT: " + h); 
     } 
    </script> 
    </body> 
</html>

开幕（改变方向时景观，我得到更多的高度，而不是宽度，反之亦然）。如果我插入一个短暂的延迟：

http://www.ebi.ac.uk/~mp/test_orientation_delay.html 

<script> 
    window.onorientationchange = function() { 
    setTimeout(function() { 
     var w = document.documentElement.clientWidth; 
     var h = document.documentElement.clientHeight; 
     alert("WIDTH: " + w + " -- HEIGHT: " + h); 
    }, 500); 
    } 
</script>

的clientWidth和clientHeight正确检索。这不会发生在Safari（iOS5）或Chrome（他们不需要短暂的延迟来显示正确的数字）。是否有其他方法可以安全地检索这些数字（不必引入足够或不足的任意延迟）？

来源

2013-04-26 emepyc

可能为时已晚，但我认为这与事件触发时您仍在查看BEFORE状态有关。新事件将在事件发生后发生，因为事件只会告诉你“我正要改变方向，但还没有做。”

来源

2014-02-11 18:05:15 Learner

clientWidth和clientHeight在Android默认浏览器上延迟？

回答

相关问题