2

次のようなページがあります。

<html>
    <body>
        <div id="outer">
            <div id="inner">
                <img width="300" height="250" src="someimage.jpg"/>
            </div>
        </div>
    </body>
</html>

CSS スタイルは次のとおりです。

*{
    margin:0px;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-user-select: none;
    -webkit-touch-callout: none;
}

body {
    width:100%;
    height:100%;
    background:red;
    overflow:hidden;
}

#outer {
  position:absolute;
  top:0px;
  left:0px;
  width:100%;
  height:100%;
  display:-webkit-box;
  -webkit-box-orient:horizontal;
  -webkit-box-pack:center;
  -webkit-box-align:center;
  overflow:hidden;
  border: 1px solid blue;
}

私は奇妙な振る舞いをたくさんしています:

  1. WebView で Web ページを最初に読み込むと、青い線しか表示されません。innerdivに画像がないようです。
  2. 最初の更新で、WebView はゆっくりと 100% の高さまで拡大します。それはゆっくりと明らかになりsomeimage.jpgます。outer画面全体を占める必要があることにゆっくりと気付くので、これは divのアニメーションのようなものです。
  3. 以降のすべての更新では、展開アニメーションは発生しません。すべてがうまく見えます。

Web ページの最初の 2 つの読み込みで何が起こっているのでしょうか?

もう 1 つの奇妙な点は、その青い境界線がなければ、2 番目と 3 番目は起こらないということです。つまり、実際には Collapsed の青い境界線である青い線だけで立ち往生していdivます。innerdivの内容を表示するために境界線が必要な理由がわかりません。

すべての読み込みに同じ WebView を使用していることに注意してください。つまり、単に呼び出しているだけWebView#loadUrlです。

4

1 に答える 1

0

なぜそれがそのように「拡張」されているのかを理解しました。レイアウトパラメータを使用してWebViewを追加していませんでした。私の問題はすべて、この小さな詳細に起因しているようです。

于 2013-03-04T05:52:52.253 に答える