Cordova Dynamic Zoom&元视口不工作

时间:2014-04-05 04:26:46

标签: android html ios css cordova

我正在尝试在Cordova 3.4.0应用中动态启用/禁用用户缩放。

我的初始视口设置为:

<meta id="viewport-meta" name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />

当我启用缩放时,我会改为:

viewport.setAttribute('content', 'user-scalable=yes, initial-scale=1, maximum-scale=2, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi');

然后,为了禁用缩放并恢复原始大小,我执行:

viewport.setAttribute('content', 'user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi');

现在,问题是,在我启用缩放时手动捏合放大后,当我尝试重置视口以禁用缩放时,那些初始缩放和最大缩放不会生效。只有用户可扩展才会生效,因此我不能再进/出,但页面不会重置为初始比例/最大比例= 1,并保持在缩放的等级2。

如何强制页面再次缩小到1的初始比例?请指教。非常感谢你。

1 个答案:

答案 0 :(得分:0)

Phonegap和cordova总是将应用程序渲染为网页,因此我认为没有必要添加这样的缩放代码。缩放必须自动工作,除非在配置文件中禁用它。

但如果它仍然不起作用。这是一个你可以使用的插件

http://cubiq.org/iscroll-4

此插件可以应用于您的div,它将为您提供此功能。

你也可以使用hammer.js这是一个提供这些功能的javascript库

http://eightmedia.github.io/hammer.js/