jQuery移动旋转问题

Question

我正在尝试使用jquery mobile(beta 3).加载应用程序时,Everthing工作正常.但是,当您将iPhone旋转到水平时,布局无法正确调整.

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

有没有人有办法解决吗？

Answer 1

如果不需要缩放是<meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1">最少的hackish.

如果要保持缩放,请尝试此解决方案.

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文档

iOS中存在一个小问题,在使用这些视口设置更改方向时未正确设置宽度,但希望将来修复此问题.您可以设置其他视口值以在需要时禁用缩放,因为这是页面内容的一部分,而不是库.