Red Spark Posted October 19, 2014 Share Posted October 19, 2014 function foo (){ var svg = document.createElementNS("http://www.w3.org/2000/svg", "svg"); var pixelRatio = window.devicePixelRatio || 1; var windowPhysicalWidth = pixelRatio * svg.screenPixelToMillimeterX * window.innerWidth / 25.4; var windowPhysicalHeight = pixelRatio * svg.screenPixelToMillimeterY * window.innerHeight / 25.4; var windowPhysicalDiagonal = Math.sqrt (Math.pow(windowPhysicalWidth, 2) + Math.pow(windowPhysicalHeight, 2)); console.log (windowPhysicalDiagonal);};After some googling and stakeoverflowing I've created a snippet to calculate the physical size of your inner window in pure javascript. It could be super effective when designing UI and HUD for different screen sizes if you want your buttons, icons and bitmap fonts to look exactly right, and not too small or too large. To test it out open a new browser window, then go to console and copy the code above, then hit Enter. Then type in:foo ()to run this function and it will tell you what diagonal in inches your current inner window is. Try different browsers, resizing your window, zooming in and out, etc. Tests on retina displays are much appreciated too. Link to comment Share on other sites More sharing options...
rich Posted October 19, 2014 Share Posted October 19, 2014 I'm afraid this doesn't work consistently in iOS8 (landscape mode specifically). Often the innerHeight doesn't take into consideration the Safari UI. Sometimes it does, sometimes it doesn't. It's just basically unreliable (the value itself I mean, not your approach specifically). Aside from that it was fine on desktop browsers. Link to comment Share on other sites More sharing options...
Red Spark Posted October 19, 2014 Author Share Posted October 19, 2014 I'm afraid this doesn't work consistently in iOS8 (landscape mode specifically). Often the innerHeight doesn't take into consideration the Safari UI. Sometimes it does, sometimes it doesn't. It's just basically unreliable (the value itself I mean, not your approach specifically). Aside from that it was fine on desktop browsers. Yep, but still could be useful to distinct between 4'', 7'' and 10'' devices. Unfortunately, there seems to be no straightforward legitimate way to find physical dimensions. Link to comment Share on other sites More sharing options...
Recommended Posts