Disable zoom buttons in Phonegap's inappbrowser

问题

After hours of searching and trying different things I'm close to give up. I want to open an external URL in the inAppBrowser that is now included to the Phonegap Build. I remove the address bar with location=no (also tried toolbar=no, but it didn't do anything), however the zoom (+ and - buttons) that appears whenever you scroll the page won't go away. I can't find a way to disable it, but maybe I overlook something? I'd just use the pinch zoom, so I don't see the reason to have these ugly buttons on top of the page (which is designed specifically for this app).

So is there a way to disable built-in zoom buttons?

I'm testing on Android, but planning to also work on the iPhone version.

回答1:

I had the same issue, but using Cordova instead of Phonegap Build. The trick that did it for me was to change line 575 of InAppBrowser.java to settings.setBuiltInZoomControls(false);.

That won't work for iOS of course, but as far as I know there is no other build in way provided by Phonegap/Cordova.

回答2:

try zoom=no

you can find details on cordova inappbrowser plugin documentation: https://github.com/apache/cordova-plugin-inappbrowser

回答3:

<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" />

Use this meta tag in webview external page Thanks...

回答4:

Using the InAppBrowser plugin, I encountered the same problem.

I managed to hide the +/- "ugly" buttons, but keep the zooming behavior (using pinch gesture) by changing the InAppBrowser.java file, and using the following commands :

WebSettings settings = inAppWebView.getSettings();
settings.setBuiltInZoomControls(true); // enable built-in zoom mechanisms
settings.setDisplayZoomControls(false); // disable WebView's zoom controls display

Found it here: https://developer.android.com/reference/android/webkit/WebSettings.html#setDisplayZoomControls(boolean)

回答5:

This only remove the zoom button and it is for IOS only:

Open the file in your project:

[YourAppName]/platforms/ios/[YourAppName]/Plugins/org.apache.cordova.inappbrowser/src/ios/CDVInAppBrowser.m

Find and change from this:

[self.toolbar setItems:@[self.closeButton, flexibleSpaceButton, self.backButton, fixedSpaceButton, self.forwardButton]];

to this:

[self.toolbar setItems:@[self.closeButton, flexibleSpaceButton]];

And then build the project with the command line.

回答6:

try this: var authWindow = window.open(authUrl, '_blank', 'location=no,zoom=no,toolbar=no');

来源：https://stackoverflow.com/questions/23565487/disable-zoom-buttons-in-phonegaps-inappbrowser