2

ウィンドウの幅が物理画面の幅と同じになることを期待しています。

私の Galaxy Nexus では、画面の幅は 720 ピクセルですが、ウィンドウの幅は 360 です。

なんで?どうしたの?ページの完全なコード:

<!DOCTYPE html>
<html>
<head> 
  <meta charset="UTF-8" />
  <title>My Page</title> 
  <meta name="apple-mobile-web-app-capable" content="yes" />
  <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no" />
  <script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.3.min.js"></script>
  <script type="text/javascript">
    $(function() {
      windowWidth = $(window).width();
      windowHeight = $(window).height();

      alert("width: " + windowWidth + " height: " + windowHeight);
    });

</script>
</head>
<body id="bo">
</body>
</html>
4

1 に答える 1

2

デフォルトではWebView、Android の は Web ページが中密度デバイスをターゲットにしていると想定するため、それに応じてスケーリングします。

ドキュメントから( Building web pages to support different screen densitiesというタイトルのセクションを参照):

デフォルトでは、WebView は Web ページをスケーリングして、中密度画面のデフォルトの外観に一致するサイズで描画されるようにします。そのため、高密度画面では 1.5 倍のスケーリング (ピクセルが小さいため) を適用し、低密度画面では 0.75 倍のスケーリング (ピクセルが大きいため) を適用します。API レベルの ECLAIR 以降、WebView は DOM、CSS、およびメタ タグ機能をサポートし、(Web 開発者として) さまざまな画面密度の画面をターゲットにするのに役立ちます。

したがって、Galaxy Nexus はxhdpiデバイスであるWebViewため、コンテンツに 2 倍のスケーリングが適用され、幅が 360 になります。

必要に応じてこれを変更でき<meta>ます。HTML にタグを追加する必要があります。たとえば、マークアップに次を追加すると、正確な幅になります。

<meta name="viewport" content="target-densitydpi=device-dpi" />

ただし、その場合は密度を考慮する必要があることに注意してください。

于 2012-12-12T21:33:44.340 に答える