javascript - 检测视口(viewport)方向，如果方向是纵向显示警告消息，建议用户使用说明

Question

我正在建立一个专门针对移动设备的网站。特别是有一个页面最好在横向模式下查看。

有没有办法检测访问该页面的用户是否以纵向模式查看它，如果是，则显示一条消息，通知用户该页面最好以横向模式查看？如果用户已经在横向模式下查看它，则不会出现任何消​​息。

所以基本上，我希望网站检测视口(viewport)方向，如果方向是纵向，然后显示一条警告消息，建议用户最好在横向中查看此页面> 模式。

Answer 1

if(window.innerHeight > window.innerWidth){
    alert("Please use Landscape!");
}

jQuery Mobile 有一个事件来处理这个属性的变化......如果你想在有人稍后旋转时发出警告 - orientationchange

另外，经过一番谷歌搜索后，查看 window.orientation(我相信这是以度数衡量的......)

EDIT:在移动设备上，如果你打开键盘，上面可能会失败，所以可以使用 screen.availHeight 和 screen.availWidth，即使在打开键盘后也能提供适当的高度和宽度。

if(screen.availHeight > screen.availWidth){
    alert("Please use Landscape!");
}