我们正在开发一个应仅 应在 iOS 上运行的自定义网络应用程序。该应用程序部署为网站,然后从 Safari 添加“主页图标”,因此它的行为类似于应用程序。
我们将应用行为定义为
- 没有缩放(已经工作)
- 无屏幕旋转
- 无垂直滑动
正文是 640x1096
像素。这是 iPhone 5s 的分辨率(不包括顶部的 iOS 栏)。
width=device-width, initial-scale=.5, user-scalable=no
出于某种原因,initial-scale
必须设置为 .5 而不是 1,这样网站才能完全适应iPhone 的空间。 为什么?
它已经不可缩放,但您仍然可以旋转屏幕和垂直滑动,这有点破坏应用程序的“感觉”。实际上在 y 轴上没有什么可以滑动的,所以我们不妨去掉它。
最佳答案
可以使用 TouchSwipe 完全禁用滑动.然后您可以触摸任何您想要的地方,网络应用程序不会在任何地方滑动。
$('html').swipe
({
fingers: 'all',
swipe: function() { }
});
并且可以像这样禁用旋转:
$(function()
{
window.onorientationchange = OrientationChanged;
window.setTimeout(OrientationChanged, 0);
}
function OrientationChanged(e)
{
$('body').css('-webkit-transform', window.orientation % 180 == 0 ? '' : 'rotate(-90deg)');
}
关于html - 元名称 ="viewport"- 一起禁用旋转、缩放和滑动,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29183708/