Question

cordova 3.4.0-0.1.3，在模拟器（iOS 7.1 11D167）或物理设备（iOS 7.1.1 11D201）上的行为相同。

我带了由Cordova创建的cordova示例应用程序创建hello com.example.hello HelloWorld＆＃39;并从body中删除了背景图像样式。无论取向如何，添加以下css都会产生绿色背景：

body {
    /* red */
    background-color:#FF0000;
}

@media screen and (orientation : portrait) {
     body {
        /* green */
        background-color:#00FF00; 
    }
}

@media screen and (orientation : landscape) {
     body {
        /* blue */
        background-color:#0000FF;
    }
}

我想要一种通用的方法来测试肖像/风景。以下是ios的工作，肖像的绿色背景，风景的蓝色背景。

body {
    /* red */
    background-color:#FF0000;
}

@media screen and (max-aspect-ratio: 1/1) {
     body {
        /* green */
        background-color:#00FF00;
    }
}

@media screen and (min-aspect-ratio: 1/1) {
     body {
        /* blue */
        background-color:#0000FF;
    }
}

我的定向查询有问题吗？有什么理由不采用纵横比方法吗？

shouldAutorotateToInterfaceOrientation正确返回＆＃39; YES＆＃39;。我的plist声明该应用程序支持所有方向。

感谢您的帮助。

Answer 1

我认为你必须为方向指定一个最小宽度：横向才能工作，因为iOS没有以正确的方式检测到这一点，只需使用一个简单的技巧并查找当你改变的设备宽度改变方向。

@media only screen and (max-width : 320px), (orientation: portrait) {
    /*css goes here*/
 }

@media only screen and (min-width : 320px), (orientation: landscape) {
    /*css goes here*/
}

请注意，,的作用为or。

试试这个并告诉我，如果它有帮助： - ）

Answer 2

在这个问题上花了相当多的时间，部分原因是因为谷歌没有把我引向最佳答案......我会在这里链接：Why doesn't my Cordova/PhoneGap iOS app rotate when the device rotates?

最简单的解决方案：定义window.shouldRotateToOrientation以对任何或所有4'度'值返回true：0＆amp; 180幅肖像，-90＆amp; 90景观，例如请参阅http://www.williammalone.com/articles/html5-javascript-ios-orientation/获取有用的readDeviceOrientation（尽管它只在基本问题解决后才有效）。

在Cordova 5.1.1，iOS 8，iPhone 6上测试过。也适用于模拟器。我想我可以安装最新的PhoneGap来验证它....

cordova / ios媒体查询方向永远不会报道＆＃34; landscape＆＃34;

2 个答案: