javascript - HTML viewport meta tag - Incorrect PPI/DPI/DPR values on android browsers -
i ran code below on browserstack identify various resolutions , dpi values browser reports on various android devices.
<html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta name='viewport' content='height=device-height, width=device-width, initial-scale=1' > </head> <body> <script> var w = window; var d = document; var e = d.documentelement; var g = d.getelementsbytagname('body')[0]; var dpr = window.devicepixelratio || (window.screen.devicexdpi / window.screen.logicalxdpi); document.write("dpi="+dpr); document.write("<br>"+w.innerwidth+" x "+w.innerheight); document.write("<br>"+navigator.useragent); </script> </body> </html> i have summarized results below: first column gives device name, second column gives device resolution (as per browserstack), third column os, fourth column gives dpi/ppi/dpr value, final column gives resolution returned javascript.
galaxy tab 4, 800 x 1280 android 4.4 1 980 x 1230 kindle fire hdx 7, 600 x 960 android 4.3 1 800 x 1230 google nexus 4, 384 x 640 android 4.2 1 384 x 590 galaxy note 3, 360 x 640 android 4.3 1 432 x 718 galaxy s5, 360 x 640 android 4.4 1 980 x 590 galaxy s5 mini, 360 x 640 android 4.4 1 980 x 590 iphone 6 plus, 414 x 736 ios 8.3 3 414 x 692 iphone 6, 375 x 667 ios 8.3 2 375 x 623 ipad air 768 x 1024 ios 8.3 (safari) 2 768 x 1064 ipad mini 2, 768 x 1024 ios 8.3 (safari) 2 768 x 1064 iphone 5s, 320 x 588 ios 7.0 2 320 x 504 i instead getting (x,y) resolution values
- that greater reported device. (compare column 2 5)
- and dpi value 1 (column 4). example, kindle fire reporting dpi of 1 incorrect.
- the x,y values same both landscape , portrait modes. ( not given in result above, onserved on browserstack. happening android devices. ios devices flipping (x,y) values correctly when switching between landscape , portrait mode.)
could me understand why happening?
Comments
Post a Comment