iphone - jQuery 移动旋转问题

Question

我正在试验 jquery mobile (beta 3)。加载应用程序时一切正常。但是，当您将 iPhone 旋转到水平位置时，布局不会自行正确调整。

可以在 http://jquerymobile.com/demos/1.0b3/ 上观察到同样的问题

有没有人有解决办法？

Answer 1

如果不需要缩放 <meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1">是最不骇人听闻的。

如果你想保持缩放，试试this解决方案。

var viewport = $('meta[name="viewport"]');
var nua = navigator.userAgent;

if ((nua.match(/iPad/i)) || (nua.match(/iPhone/i)) || (nua.match(/iPod/i))) {
  viewport.attr('content', 'width=device-width, minimum-scale=1.0, maximum-scale=1.0');
  $('body')[0].addEventListener("gesturestart", gestureStart, false);
}

function gestureStart() {
  viewport.attr('content', 'width=device-width, minimum-scale=0.25, maximum-scale=1.6');
}

仅供引用:这是一个已知问题，请参阅 jQM docs

iOS 中存在一个小问题，即在使用这些视口(viewport)设置更改方向时无法正确设置宽度，但这有望在未来的版本中得到修复。如果需要，您可以设置其他视口(viewport)值以禁用缩放，因为这是您的页面内容的一部分，而不是库。