JQuery移动夹缩放图像 [英] JQuery Mobile Pinch Zoom Image Only

查看:129
本文介绍了JQuery移动夹缩放图像的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个工作的JQM应用程序,我想显示一些图像。当前的图像在自己的iframe,所以他们可以从应用程序单独滚动。

I have a working JQM application that I'd like to display some images in. The images currently are in their own iframe so they can be scrolled separately from the app.

我想只能缩放iframe中的图片。

I'd like to be able to pinch zoom only the images within the iframe as well.

我意识到如果我调整以下代码片段,我可以启用捏缩放,但这启用它为整个应用程序。

I realize if I adjust the following code snippet that I can enable pinch zoom but this enabled it for the entire application.

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

通过移除最大缩放缩放返回,但对于一切。

By removing maximum-scale pinch zoom returns but for everything.

有没有办法只对图像启用双指缩放?如果可能的话,如何添加新的视口标记到iframe?

Is there a way to enable pinch zoom only for an image? How about adding a new viewport tag to the iframe, would that work if that is even possible?

UPDATE


  • 在iframe中插入HTML。添加了元标记,这没有帮助。

  • Injected HTML into the iframe. Added the meta tag, this did not help.

尝试.extend($。mobile.zoom,{locked:false,enabled:true});

Tried .extend($.mobile.zoom, {locked:false,enabled:true}); on the iframe body, this did nothing.

推荐答案

最好的方法是使用ChildBrowser插件。这在iOS和Android上是完美的图像。

It turns out the best way to do this is to use the ChildBrowser plugin. This on IOS and Android works perfect for images.

IOS Childbrowser:

IOS Childbrowser:

 https://github.com/purplecabbage/phonegap-plugins/tree/master/iPhone/ChildBrowser

Android ChildBrowser:

Android ChildBrowser:

 https://github.com/phonegap/phonegap-plugins/tree/master/Android/ChildBrowser

然后一旦完成所有设置,您可以打开URL或本地文件,例如:

Then once you have done all the setup you can open URL's or local files like this:

 window.plugins.childBrowser.onLocationChange(location);

请注意,在IOS和Android之间的完全跨平台设置中,他们需要不同版本的插件。 IOS需要在onDeviceReady中的ChildBrowser init,Android不。

Do note that in a fully cross platform setup between IOS and Android they both need different versions of the plugin. IOS requires ChildBrowser init in onDeviceReady, Android does not.

这篇关于JQuery移动夹缩放图像的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆