0

晚上好，

我一直在使用内部具有 webview 的视图时遇到一些问题。webview 正在插入一个带有外部源的 iframe（另一个域上的 html）。我正在使用 iframe，因为我需要使用外部 HTML，并且我需要与我的应用程序与点击/触摸事件进行通信。

主要问题是 webview 正在插入不需要的水平滚动条（因为 iframe 内容太大）

代码如下所示：

网页浏览：

var webview = Titanium.UI.createWebView({
    url: "/html/local.html",
    width:Ti.UI.SIZE,
    height:Ti.UI.SIZE,
    contentWidth:Ti.UI.SIZE,
    contentHeight:Ti.UI.SIZE,
    disableBounce:true,
    enableZoomControls: false
});
self.add(webview);

框架：

<html>
    <head>
        <meta name="viewport" content="width=320; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;"/>
        <meta http-equiv="cleartype" content="on">
        <script>
            function init () {
                window.theIframe.TiAPI = Ti.API;
                window.theIframe.TiApp = Ti.App;
            }
        </script>               
        <style>
            body {width:100%;margin:0;padding:0;background-color:#ccffff;}
        </style>
    </head>
    <body>
        <iframe name="theIframe" src="http://external.com/something.html" width="100%" height="100%" frameborder="0" onload="init()">
        </iframe>
    </body>
</html>

注意事项：

  • 这只发生在肖像上。它在 iPad 或 iPhone 上运行良好，具有横向视图。
  • 如果在外部 html 下，我将 body 的最大宽度设置为 320px，它可以完美地工作。我不会这样做，因为我需要它在横向和 iPad 下工作。
  • 如果我使用外部 html 作为 webview 的 URL，它也可以工作。所以这不是外部内容的问题，而是本地 html 或 webview 和 iframe 的问题。

任何想法？

4

4 回答 4

0

也许在本地 HTML 文件中，您可以关闭 iframe 的滚动。 http://www.w3schools.com/tags/att_iframe_scrolling.asp

例如：

<html>
<head>
</head>
<body>
<iframe src="http://www.yahoo.com.au" scrolling="no"></iframe>
</body>
于 2012-10-28T05:02:19.970 回答
0

在这里回答：iframe size with CSS on iOS

只需将您的 iframe 包装在一个 div 中：

overflow: auto;
-webkit-overflow-scrolling:touch;

http://jsfiddle.net/R3PKB/7/

于 2014-06-08T22:13:47.463 回答
0

我结束了对外部文件使用媒体查询，效果很好。

于 2013-12-17T05:14:44.533 回答
0

我也遇到了同样的问题，实际上设法找到了解决方案

我不知道为什么会发生这种情况，但是如果你想要 iframe 上的实际容器宽度，请改用这个 CSS：

    iframe {
        min-width: 100%; 
        width: 100px;
        *width: 100%;
    }
于 2013-11-22T10:28:45.600 回答