I am trying to use JavaScript to get the number of CSS pixels that a device has.
Basically, an old iPad has 1024x768 and a new one has 2048x1536 actual pixels, but they both have the same 1024x768 CSS pixels (the new one is a Retina / High DPI device).
If I use screen.width and screen.height then in non-Apple stuff it shows the actual screen pixels, not the CSS pixels.
screen.width/screen.heigh does actually return the CSS pixels on Apple stuff (so it returns 1024x768 on the new iPad).
The Samsung Galaxy SIII however returns the device pixels, which is no good.
I need a uniform way to return the CSS pixels.
device name / device width pixels / CSS width pixels / screen.width returns
old iPad / 1024 / 1024 / 1024
new iPad / 2048 / 1024 / 1024
an old mobile / 480 / 480 / 480
Samsung Galaxy SIII / 720 / 360 / 720
screen.innerWidth and .outerWidth won’t work as on desktops the browser might not be fully opened.
I need both the height and width of the screen’s CSS pixels.