仅限 JQuery 移动捏缩放图像 [英] JQuery Mobile Pinch Zoom Image Only

查看:22
本文介绍了仅限 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?

更新

  • 将 HTML 注入 iframe.添加了元标记,这没有帮助.

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

试过 .extend($.mobile.zoom, {locked:false,enabled:true});在 iframe 主体上,这没有任何作用.

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 子浏览器:

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

Android 子浏览器:

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天全站免登陆