2

几年前，我创建了一个网络应用程序（通过 LAMP 后端的 JS/CSS/HTML），它一直运行良好。客户现在在他的 iPhone 上使用它，并报告说，当在具有 2 个输入的登录屏幕上时，窗口放大“太多”，当他完成输入时，它不会缩放回“正常”缩放级别（从他发送的屏幕截图来看，它看起来像是缩小到“正常”和输入输入时使用的缩放级别之间的某个位置）。

是否可以控制任何一种行为？我已经阅读了有关 user-scalable:0 的元数据，但这听起来要么 A）根本不起作用，要么 B）完全阻止缩放。

我想说第二个问题更为关键（在用户输入文本后，它应该缩放回“正常”比例）。

我会再次提到这是一个通用的网络应用程序，而不是一个“iPhone 应用程序”（它建立在传统的网络技术之上，而不是 Cocoa 或 Objective-C）。我什至没有可以使用模拟器的 iPhone 或 Mac，而且我看到的 Windows 模拟器似乎只不过是图形中的 iframe。

谢谢

4

2 回答 2

2

如果您离开用户缩放选项，则由他决定返回网站原始缩放比例。纵向模式下的 iPhone safary 浏览器会在每次打开键盘或组合框时进行放大。然后它不会缩放回原始比例（必须通过双击屏幕或捏住屏幕来完成......）。

其他选项是不让用户使用视口元标记进行缩放

     <meta name="viewport" id="view" content="user-scalable=no, width=device-width, initial-scale=1.0" />

然后打开键盘或打开微调器时iphone不会缩放

我目前正在寻找解决它的方法（合并缩放可能性与键盘打开时避免缩放），但我没有找到任何方法来做到这一点......

于 2011-02-25T13:07:07.573 回答
1

我用视口解决了它：正如你所说，当没有启用用户缩放时，打开键盘或组合不会进行缩放，但是你会失去用户的缩放功能。

我在选择组合时禁用视口缩放，然后在一秒钟后恢复缩放选项：

document.documentElement.addEventListener("touchstart", function (event) {
          if((event.target.nodeName == "SELECT") || (event.target.nodeName == "INPUT") || (event.target.nodeName == "TEXTAREA")) { //it is a combo
                document.getElementById("view").setAttribute('content', 'width=device-width, user-scalable=no');
                setTimeout(function () {
                    document.getElementById("view").setAttribute('content', 'width=device-width, user-scalable=yes');
                }, 1000);
            }
            }, true);

并不是说我的视口有“视图”作为 id。

是的，我知道这不是最好的解决方案，但它确实有效......

于 2012-01-16T08:30:23.117 回答