方向显示错误,而旋转设备谷歌浏览器

Orientation is shown wrong while rotating device Google chrome

本文关键字:谷歌浏览器 旋转 显示 错误 方向      更新时间:2023-09-26

我有一个HTML5页面,它决定设备是"纵向"模式还是"横向"模式。

下面是我提醒方向的代码。有时当我从横向切换到纵向时,它仍然提醒为横向,我检查的坐标显示为错误。测试设备为Google Nexus

Tablet Google Nexus 7android版本4.2.2Chrome应用版本:35.0.1916.141操作系统android 4.4.2;Nexus 7 Build/KOT49HJavascript版本:V8 3.25.28.18

<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>
    <div id="page">
    </div>
</body>
</html>
<script type="text/javascript">
    function pageSetter() {
        if (window.matchMedia("(orientation: portrait)").matches) {
            // you're in PORTRAIT mode
            alert('Portrait');
        }
        if (window.matchMedia("(orientation: landscape)").matches) {
            // you're in LANDSCAPE mode
            alert('LANDSCAPE');
        }
    }
    pageSetter();
    window.addEventListener("orientationchange", function () {
        pageSetter();
    }, false)
</script>

窗口。Orientation ==0为默认方向。并不意味着它处于竖屏模式。下面的链接详细说明。

对窗口朝向的误解

解决方案是使用Resize来代替

横向/纵向检测