[英]Javascript Orientation Change doesn't work with PhoneGap on iPad
I'm adapting a small HTML/CSS/Javascript driven web magazine as an iApp for the iPad with the great mobile framework PhoneGap. 我正在使用一个小的HTML / CSS / Javascript驱动的网络杂志作为iPad的iApp,使用优秀的移动框架PhoneGap。 Everything works great, except the orientation change from portrait to landscape mode.
除了从纵向模式到横向模式的方向变化外,一切都很有效。
I use the following Javascript code in the header of the index.html (portrait): 我在index.html(纵向)的标题中使用以下Javascript代码:
var isiPad = navigator.userAgent.match(/iPad/i) != null;
var isiPhone = navigator.userAgent.match(/iPhone/i) != null;
function updateOrientation() {
if (isiPad || isiPhone) {
switch (window.orientation) {
case 90:
window.location = "index_landscape.html";
break;
case -90:
window.location = "index_landscape.html";
break;
}
}
}
with the following body tag: 使用以下正文标记:
<body onorientationchange="updateOrientation();">
If I rotate the iPad to landscape mode, it doesn't change to index-landscape.html. 如果我将iPad旋转到横向模式,它不会更改为index-landscape.html。
Does anybody know where the problem is? 有人知道问题出在哪里吗? Isn't it possible to change the HTML file, while changing orientation within the PhoneGap framework?
在改变PhoneGap框架内的方向时,是否可以更改HTML文件? With other words, can I only use one HTML file (index.html) with PhoneGap and have to use CSS for the orientation change?
换句话说,我是否只能将一个 HTML文件(index.html)与PhoneGap一起使用,并且必须使用CSS进行方向更改?
If I check out the app as a website with the iPad Safari browser, the orientation change works properly. 如果我将应用程序作为带有iPad Safari浏览器的网站检出,则方向更改可以正常进行。
Thanks for any help! 谢谢你的帮助!
I just found an other solution to the problem. 我刚刚找到了另一个问题的解决方案。 I use the body onload function with the onDeviceReady function from phonegap.js to check the orientations:
我使用body onload函数和phonegap.js中的onDeviceReady函数来检查方向:
The following javascript code works properly now: 以下javascript代码现在可以正常工作:
function onLoad() {
document.addEventListener("deviceready", onDeviceReady, false);
}
function onDeviceReady() {
document.addEventListener("orientationChanged", updateOrientation);
}
function updateOrientation(e) {
switch (e.orientation) {
case 90:
window.location = "index_landscape.html";
break;
case -90:
window.location = "index_landscape.html";
break;
}
}
UPDATE: This worked more than two years ago with old versions of Phonegap and iOS SDK, but according some users, it doesn't work anymore. 更新:两年多以前,它使用旧版本的Phonegap和iOS SDK,但根据一些用户的说法,它不再适用了。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.