How to determine phone screen diagonal in inches using javascript?

Question

JavaScript

How to determine phone screen diagonal in javascript?

Answer 1

Pixels:

function getPxDiag(){
   var scW = screen.width, scH = screen.height;
   //return Math.hypot(scW, scH) - не работает в IE
   return Math.sqrt( Math.pow(scW, 2) + Math.pow(scH, 2) );
}

To convert to inches you need to know the number of dots per linear inch (DPI) . To do this, you can use the old CSS unit of change - in . The disadvantage of this method is that you have to put an extra element into the DOM.

//Общая формула: PIXEL = INCHES / (1 / DPI);
function getInchDiag(){
  var DPI = inch.offsetWidth;
  return getPxDiag() * (1/DPI);
}

alert( getInchDiag() );

jsfiddle.net/In4in/yboco3wd
An interesting point - this variant, as well as the riot26 variant , show 5 inches more for my device, no idea why.
Actually, this turned out to be due to the fact that on most devices the browser (or something else, I don’t understand) incorrectly determines DPI (at 96 dpi) and 1in, accordingly, has a width less than a real inch.
How to fix? -No idea :(

Answer 2

www.quirksmode.org/mobile/viewports.html ( translation )
tl;dr
use device-width and device-height in css
or screen.width and screen.height in js