我正在使用Phonegap创建一个多设备多平台应用程序。
基本上,我有两种情况:
我应该可以使用媒体查询自定义布局和展示位置,具体取决于设备是平板电脑还是智能手机(分别是横向或纵向)。 无论设备如何,我都尝试锁定到肖像,然后使用CSS媒体查询和旋转变换,但我遇到了两个问题:
我无法找到针对平板电脑的媒体查询并排除智能手机,反之亦然,决议范围似乎过于稀疏。
与body{transform:rotate(90deg)}
合作看起来像是一场噩梦,将一切都搞定了。
我也研究过:https://github.com/champierre/pg-plugin-screen-orientation但它似乎只适用于Android,我需要同时支持iOS和Android。
有没有人有过这种特殊情况的经验?有关处理此定位问题的任何建议吗?
答案 0 :(得分:1)
您可以使用navigator.userAgent
获取设备类型。例如,像这样:
var deviceType = (navigator.userAgent.match(/iPad/i)) == "iPad" ? "iPad" : (navigator.userAgent.match(/iPhone/i)) == "iPhone" ? "iPhone" : (navigator.userAgent.match(/Android/i)) == "Android" ? "Android" : (navigator.userAgent.match(/BlackBerry/i)) == "BlackBerry" ? "BlackBerry" : "null";
alert(navigator.userAgent);
或者您可以使用this page...
中的指南之后,您可以使用以下代码设置方向:
$(window).bind('orientationchange', function(event){
if (/*is tablet*/) {
navigator.screenOrientation.set('landscape');
}
else if (/* is smart phone */) {
navigator.screenOrientation.set('portrait');
}
});
我希望以上代码对您有所帮助;)