Question

我正在开发基于android sdk和Eclipse的Phonegap应用程序。只需使用默认代码并添加<meta>以获得可扩展性，但它不允许我在Android SGS2设备中放大或缩小。（我没有检查过iPhone，因为我没有。）

代码如下：

<!DOCTYPE HTML>
<html>
  <head>
  <meta name="viewport" 
        content="user-scalable=yes" />
  <!--<meta name="viewport" 
        content="user-scalable=yes, 
                initial-scale=1, 
                maximum-scale=4, 
                minimum-scale=1, 
                width=device-width, 
                height=device-height, 
                target-densitydpi=device-dpi" />
                 -->
    <title>First App</title>
  <script src="cordova-2.2.0.js"></script>
  <script>
     function onLoad(){
          document.addEventListener("deviceready",
                onDeviceReady, true);
     }
     function onDeviceReady(){
                navigator.notification.alert("PhoneGap is working!!");
     }
  </script>
  </head>
  <body onload="onLoad();">
       <h1>Welcome to PhoneGap</h1>
       <h2>Edit assets/www/index.html</h2>
  </body>
</html>

Answer 1

在Android上，您是否也像loadUrl一样启用了缩放？

super.loadUrl(Config.getStartUrl(), 80000);

WebSettings settings = super.appView.getSettings();
settings.setBuiltInZoomControls(true);
settings.setSupportZoom(true);

就个人而言，除非你真的需要支持它，否则启用缩放确实是在寻找麻烦。

Answer 2

尝试使用 1 代替是 用户可扩展：

<meta name="viewport" content="user-scalable=1" />

可以设置为是或 1

用户可扩展的属性已转换为“用户缩放”，其中包含以下值翻译。

是和否分别翻译成'zoom'和'fixed'。
数字≥1，数字≤-1，设备宽度和设备高度映射到“缩放”</ li>
范围＆lt; -1,1＆gt;中的数字和未知值映射到'固定'

参见参考：

W3C CSS Device Adaptation Spec: user-scalable

而且：

http://dev.w3.org/csswg/css-device-adapt/

viewport - user-scalable = yes不起作用

2 个答案: