I\'m using window.innerHeight and window.innerWidth instructions to get the browser\'s available window size. It\'s working with firefox, safari (on a mac
Add
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=no">
to the <head>
element. That will fix the innerWidth
issue.
The retina has high density pixels - basically 4 hardware pixels to 1 logical pixel. That's why they report the same resolution.
Also specify the height in the viewport meta tag according to this:
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
I had problems with using jQuery $(window).height() on my iPad 2 (5.0.1) since I had missed out specifying the height in the meta tag. After adding it works much better.