Cordova InAppBrowser 不缩放加载的页面答案

【问题标题】：Cordova InAppBrowser Doesn't scale the page loadedCordova InAppBrowser 不缩放加载的页面
【发布时间】：2014-03-28 01:04:28
【问题描述】：

谁能帮我获取 Cordova InAppBrowser 在 Android 应用上加载的外部页面以适应手机屏幕尺寸？

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

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

当我调用 url 时，我会看到以下屏幕

谁能帮帮我？

【问题讨论】：

标签： android cordova sencha-architect inappbrowser

【解决方案1】：

将此代码添加到您的 index.html 中

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

【讨论】：

【解决方案2】：

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

phonegap 还允许你在加载 url 后执行一些脚本，就像注入脚本一样。

 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");
    });
}

试试这个，它记录在案here

【讨论】：