Home/ Questions/Q 8986955
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-15T21:40:31+00:00

I’m expecting that width of window with will be the same with width of

  • 0

I’m expecting that width of window with will be the same with width of the physical screen.

On my Galaxy Nexus width of screen is 720 pixels, but width of window is 360.

Why? What’s wrong? The full code of page:

<!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>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    By default, the WebView in Android will assume your web page is targeting a medium density device, and thus, it will scale things accordingly.

    From the documentation (see the section titled Building web pages to support different screen densities):

    By default, WebView scales a web page so that it is drawn at a size
    that matches the default appearance on a medium density screen. So, it
    applies 1.5x scaling on a high density screen (because its pixels are
    smaller) and 0.75x scaling on a low density screen (because its pixels
    are bigger). Starting with API level ECLAIR, WebView supports DOM,
    CSS, and meta tag features to help you (as a web developer) target
    screens with different screen densities.

    So, since the Galaxy Nexus is an xhdpi device, the WebView will apply 2x scaling to your content, thus resulting in a width of 360.

    You can change this if you want to, it requires the addition of a <meta> tag in your HTML. For example, adding the following to your markup should result in an accurate width:

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

    However, be aware that you will need to take densities into account in that case.

    • 0