0

こんばんは、

内部にWebビューがあるビューで問題が発生しています。Webビューは、外部ソース(別のドメインのhtml)を使用してiframeを挿入しています。外部HTMLを使用する必要があり、アプリケーションでクリック/タッチイベントと通信する必要があるため、iframeを使用しています。

主な問題は、Webビューが不要な水平スクロールバーを挿入していることです(iframeコンテンツが大きすぎるため)

コードは次のようになります。

Webview:

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

iframe:

<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で、本文の最大幅を320pxに設定すると、完全に機能します。ランドスケープとiPadで動作するために必要なので、この方法では作成しません。
  • WebビューのURLとして外部HTMLを使用すると、それも機能します。したがって、これは外部コンテンツの問題ではなく、ローカルhtmlまたはWebビューと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で実際のコンテナ幅が必要な場合は、代わりに次のCSSを使用してください。

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

外部ファイルでのメディアクエリの使用を終了しましたが、これは非常にうまく機能します。

于 2013-12-17T05:14:44.533 に答える
0

ここで答えられます:iOSでのCSSを使用したiframeサイズ

iframeをdivでラップするだけです。

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

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

于 2014-06-08T22:13:47.463 に答える