Oblivion
Oblivion

Reputation: 41

Ionic how to hide address bar and the zoom

I am trying to create app that loads mobile version of my website. SO i am using ionic and cordoba Inappbrowser. Here is my code in app.js

.controller("ExampleController", function ($scope) {

    $scope.openCordovaWebView = function()
    {
         // Open cordova webview if the url is in the whitelist otherwise opens in app browser
         window.open('http://my-site.net','_self', 'locaiton=no', 'toolbar:no'); 
    };

     $scope.openInExternalBrowser = function()
    {
         // Open in external browser
         window.open('http://my-site.net','_system','location=no'); 
    };

    $scope.openInAppBrowser = function()
    {
         // Open in app browser
         window.open('http://my-site.net','_blank', 'locaiton=yes', 'toolbar:no'); 
    };
});

I am trying on 3 ways, but all of those case i have address bar and some zoom tool bottom right. You can see it on attached image below.

How i can hide address bar and zoom tool Thanks! enter image description here

Upvotes: 0

Views: 1969

Answers (1)

e7lT2P
e7lT2P

Reputation: 1931

In your code i see probably a typo:

'locaiton=yes' 

instead of 'location=no'.

To remove the URL:

var ref = cordova.InAppBrowser('http://apache.org', '_blank', 'location=no');

To remove the entire toolbar:

var ref = cordova.InAppBrowser('http://apache.org', '_blank', 'toolbar=no');

To remove the zoom:

zoom: set to yes to show Android browser's zoom controls, set to no to hide them. Default value is yes .

For all the option please take a look at: https://github.com/apache/cordova-plugin-inappbrowser

or in the official: https://cordova.apache.org/docs/en/latest/reference/cordova-plugin-inappbrowser/

Upvotes: 4

Related Questions