Die genaue physikalische mobile Auflösung in Javascript

Question

Ich baue eine Seite, die dem Benutzer so viele Informationen über ihr Gerät wie möglich zeigt. Bei mobilen Geräten entspricht die physikalische Auflösung nicht der vom Browser interpretierten Auflösung, da ansonsten hochauflösende Geräte die Seiten nicht sehr gut darstellen würden.

Zum Beispiel hat mein Moto X Style eine Auflösung von 1440 x 2560 Pixel, die sogar höher als die meisten PC-Monitore ist. Es wird um das Pixelverhältnis des Geräts verkleinert, das auf meinem Gerät auf 3,5 eingestellt ist. dies macht die 'interpretierte Auflösung' 412 x 732 Pixel

Für viele Geräte würde es ausreichen, die interpretierte Auflösung von screen.[width/height] zu multiplizieren und mit window.devicePixelRatio zu multiplizieren. Aber in meinem Fall ist dies nur eine Schätzung und kommt bei 1442 x 2562, vermutlich wegen der Rundung heraus.

Gibt es einen todsicheren Weg, um diesen genauen Wert zu erhalten? Oder vielleicht die Rundung in diesen Werten unterdrücken? Irgendwelche Gedanken werden geschätzt.

Answer 1

können Sie versuchen, diese Seite genaue Höhe Breite der aktuellen Geräte

var w = window.innerWidth; 
var h = window.innerHeight; 

Answer 2

Check-out zu bekommen:

http://www.quirksmode.org/blog/archives/2012/07/more_about_devi.html

Offensichtlich ändert sich pro Gerät, aber Sie sind auf dem richtigen verfolgen mit:

Math.round(screen.width||height*window.devicePixelRatio) 

Viel Glück.

Answer 3

Ich verwende diese, um die Breite/Höhe des Fensters des Browsers zu erhalten.

getWindowWidth: function() { 
    if (true) { 
     try { 
      return document.documentElement.clientWidth; 
     } 
     catch (error) {} 
    } 
    else { 
     try { 
      return window.innerWidth; 
     } 
     catch (error) {} 
    } 
    return 0; 
}, 

getWindowHeight: function() { 
    if (true) { 
     try { 
      return document.documentElement.clientHeight; 
     } 
     catch (error) {} 
    } 
    else { 
     try { 
      return window.innerHeight; 
     } 
     catch (error) {} 
    } 
    return 0; 
},