8

我们正在构建一个为平板电脑开发的 HTML5/JavaScript 应用程序,我们希望以横向和纵向不同的方式布置我的屏幕。

最初,我们捕获方向更改通知,并跟踪当前方向(通常报告为 0、90、-90 或 180 度 - 请参阅此问题)。不幸的是,不同的设备将不同的方向报告为“0”。该链接认为这是一个错误,但有一些证据表明这是按设计工作的 - 例如,本文建议“横向”是默认方向,并且这些设备在横向保持时报告“0”方向模式。

接下来我们尝试只查看实际的屏幕尺寸,假设当宽度大于高度时,我们处于横向模式。但是当屏幕键盘显示时,这个算法会变得混乱——当键盘显示时,会返回可见区域的尺寸。严格来说,当设备处于纵向模式,但未被键盘遮挡的屏幕部分比其高时更宽。

这个问题的回答已经很老了。这仍然是最好的答案吗?有没有人有一个很好的算法来考虑键盘的可见性?

4

1 回答 1

4

http://jsfiddle.net/jjc39/

试试这个:

<span id="orientation">orientation</span>​

$(document).ready(checkOrientation);
$(window).resize(checkOrientation);

function checkOrientation() {
    var orientation = "Portrait";
    var screenWidth = $(window).width();
    var screenHeight = $(window).height();
    if (screenWidth > screenHeight) {
        orientation = "Landscape";
    }
    $("#orientation").html(orientation);
}​
于 2012-12-13T21:51:12.327 回答