在 jquery mobile 上启用缩放效果答案

【问题标题】：Enable zoom effect on jquery mobile在 jquery mobile 上启用缩放效果
【发布时间】：2013-11-12 15:49:57
【问题描述】：

我想在我的 iOS iphone jqm 1.3.2 应用上启用 jquery mobile 中的标准缩放效果。

我已经试过了：

<meta name="viewport" id="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=5.0, user-scalable=yes" />

和

$(document).on("mobileinit", function () {
             $.mobile.defaultPageTransition = 'none';
             $.mobile.defaultDialogTransition = 'pop';

             $.mobile.pageLoadErrorMessage = 'Seitenladefehler';
             $.mobile.loadingMessage = 'Lädt...';
             $.mobile.dialog.prototype.options.closeBtnText = "Schließen";
             $.mobile.page.prototype.options.backBtnText = "Zurück";

             $.mobile.listview.prototype.options.filterPlaceholder = "Suchen...";

             $.mobile.activeBtnClass = 'unused';
             $.mobile.zoom.enabled = true;

             $.mobile.ajaxEnabled = true;

             //$.mobile.touchOverflowEnabled = true;

         });

jqm 应用程序内仍然没有两指缩放。我错过了什么？

【问题讨论】：

你确定它不工作吗？我刚刚测试了您的代码及其缩放。
不...该应用程序一开始不应该被缩放，我不确定我是否清除了所有阻止缩放的选项。是否还有其他可能防止我错过的缩放？
我的意思是放大两个手指的运动。初始缩放保持不变。
是的，两指缩放不起作用。除了“设置”>“可访问性”下的原生 iOS 缩放选项外，还有其他缩放可能性吗？很奇怪...

标签： javascript jquery ios jquery-mobile

【解决方案1】：

为什么不一起删除最大规模：

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

同样在 iOS 上，我相信 user-scalable 设置为 1 而不是 yes 请参阅 user-scalable spec

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

或者在没有用户可扩展

的情况下也可以尝试

<meta id="viewport" name="viewport" content="width=device-width,initial-scale=1.0">

也可以通过 jQuery Mobile API：

$(document).bind( "mobileinit", function(event) {
       $.extend($.mobile.zoom, {locked:false,enabled:true});
});

mobileinit 事件：

http://jquerymobile.com/demos/1.0b2/docs/api/globalconfig.html

参见参考资料：

W3C CSS Device Adaptation Spec

【讨论】：