Shouldn't window.screen.width/height correspond to actual screen width/height?

Ates Goral picture Ates Goral · Sep 13, 2010 · Viewed 11.8k times · Source

Toying around with the WebKit browser in the new Kindle 3G, I noticed that window.screen.width and window.screen.height don't reflect the actual screen dimensions. The physical screen (or rather, paper) dimensions are 800 x 600. I get:

  • 800 x 506 in landscape mode
  • 600 x 706 in portrait mode

But interestingly, both Chrome and Safari (which are also WebKit) running on my desktop report the actual screen resolution.

According to MDC, these properties are not part of any specification, so there's probably no strict definition of what width/height should report. But, shouldn't it be expected that they reflect the actual screen dimensions?

Answer

HotFudgeSunday picture HotFudgeSunday · Mar 3, 2011

Update:

The issue we see in the emulator with window.screen.width is when we use screens which don't reflect the actual pixels of the device. So what you see on the screen is 320 and what the device has is 480 or whatever. I don't understand, though, why the value of screen width would give the emulator size on the screen and not the actual pixels.

This thing might be the same issue with the devices? If their density is higher at some sizes... for whatever the reason this could translate to some wrong screen width size?

Anyway, read below for my solution.


screen.availWidth does not work for me on certain screen sizes on the emulator.

Only thing is working for me now is:

window.innerWidth
window.innerHeight

Which will return the value of the Viewport. In my case I'm running an HTML5 app. This values will not update on zoom, apparently.

They have some issues with this sizes on Android's Webkit. You can see the devs from Android talking about it here. Probably fixed in Honeycomb.

Somebody claims it takes some sizes as if the soft keyboard would be present.