Cordova InAppBrowser无法缩放加载的页面 [英] Cordova InAppBrowser Doesn't scale the page loaded

问题描述

任何人都可以帮助我获取Cordova InAppBrowser在Android应用程序上加载的外部页面以适合手机屏幕尺寸吗?.

Can anyone please help me get the external page that the Cordova InAppBrowser loads on Android app to fit to the phone screen size ?.

我正在使用以下代码从Sencha Touch应用程序调用inapp浏览器.

I am invoking the inapp browser from a Sencha Touch app using the follwing code.

 var opt = 'location=no,clearcache=yes,closebuttoncaption=Back,EnableViewPortScale=yes';
    window.open('http://sg-prod-mobilityapi.cloudapp.net','_blank', opt);

每当我调用url时，都会得到以下屏幕

When ever I invoke the url I get the following screen

有人可以帮我吗?.

推荐答案

如果外部页面适合浏览器视口，则它应该具有响应式设计.我通过了 url ，因为中间div的宽度和高度固定为340x380 px .您只能在应用浏览器中启用放大功能.

If the external page fit to the browser viewport, it should have a responsive design. I gone through that url, in that the middle div is set with fixed width and height of 340x380 px. you can only enable the zooming in in app browser.

通过phonegap，您还可以在加载网址后执行一些脚本，就像注入脚本一样.

Also phonegap allow you to execute some scripts after loading the url, just like injecting scripts.

 var iabRef = window.open('http://sg-prod-mobilityapi.cloudapp.net', '_blank', 'location=yes');
     iabRef.addEventListener('loadstop', replaceCustomStyle);

 function replaceCustomStyle() {
    iabRef.executeScript({
        code: "var itm = document.querySelector('#Main div'); 
                   itm.setAttribute('style','width:100%');"
    }, function() {
        alert("Element Successfully Hijacked");
    });
}

尝试此操作，并在 此处

Try this and it is documented here

这篇关于Cordova InAppBrowser无法缩放加载的页面的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！