Question

我正在寻找一个脚本来检测屏幕是横向还是纵向而不旋转手机（如果你想要的初始屏幕尺寸），以显示图像以旋转设备，如果游戏是横向的（并且页面的初始加载是肖像）。

我发现了很多关于“方向更改”事件的信息，但没有检测到页面初始加载时的视图。

Answer 1

您可以尝试使用

function isPortrait() {
  if (typeof (window.orientation) != 'undefined') {
    return (window.orientation === 0 || window.orientation === 180);
  }
  else {
    return (window.innerHeight > window.innerWidth);
  }
}

它测试是否支持window.orientation属性，如果它不检查窗口高度是否大于窗口宽度。

EDIT。 window.orientation优先于宽度和高度测试，因为在移动设备上，当屏幕键盘弹出时，窗口高度会发生变化，从而产生错误的景观信息。

EDIT。您也可以使用媒体查询，但无论您选择什么，如果您定位的浏览器不支持它，请确保有后备。

http://caniuse.com/#search=matchmedia

Answer 2

随时执行此操作。

if (window.matchMedia("(orientation: landscape)").matches){

   //Go landscape
};
else {

   // Go portrait
}

警告：这为您提供了浏览器的方向。不是设备。因此，我假设浏览器已最大化以自动适应您设备的屏幕。

Google提供“媒体查询”，了解有关媒体更改的更多信息。

HTML5，Javascreen显示图像，如果肖像/风景

2 个答案: