旋转到横向时，JQuery Mobile Beta 1不会调整iPhone屏幕的大小 [英] JQuery Mobile Beta 1 is not resizing the screen on iphone when rotated to landscape
问题描述
我正在使用JQUery Mobile Beta 1编写移动应用程序，并希望从纵向旋转到横向旋转(反之亦然)时，屏幕应该在iPhone上自动调整，但是这没有发生.
I am writing mobile app with JQUery Mobile Beta 1 and was expecting that the screen should adjust automatically on iphone when rotated from portrait to landscape and vice versa but it is not happening.
我只是打开该链接进行了检查(测试版1文档演示)
I simply checked with opening this link (Beta 1 doc demo)
http://jquerymobile.com/demos/1.0b1/docs/pages/page-template.html
但它也不能调整屏幕.
我想念什么吗?
对于Beta 2来说似乎是相同的.我检查了演示& docs iPhone，其行为类似.我需要点击屏幕进行调整.不能像纵向那样自动进行操作.
It seems to be same for Beta 2. I checked the demos & docs iPhone and it behaves similarly. I need to tap a screen to adjust it. Not doing automatically as in portrait orientation.
Itizme
推荐答案
在文档<head>中，而不要这样做:
In your document <head> instead of doing this:
<meta name="viewport" content="width=device-width, initial-scale=1">
执行此操作:
<meta name="viewport" content="initial-scale=1, maximum-scale=1">
为什么行得通
当设备方向改变时(即旋转时)，MobileSafari将在调整视口大小之前放大页面.因此，当应该仅让页面自行调整大小时，将根据纵向屏幕宽度应用缩放.通过将初始比例和最大比例都设置为1，我们将禁用缩放.因此，MobileSafari旋转时不会错误地放大页面，从而解决了问题.
Why this works
When your device oritentation changes (i.e. when you rotate it) MobileSafari will zoom into the page before it resizes the viewport. So the zoom is applied based on the portrait screen width when it should just let the page resize on its own. By setting both initial and maximum scale to 1 we disable zooming. So MobileSafari can't zoom into your page incorrectly when you rotate, thereby fixing the problem.
另请参阅: jQuery Mobile错误报告
这篇关于旋转到横向时，JQuery Mobile Beta 1不会调整iPhone屏幕的大小的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
