Javascript Reference
Categories: screen

javascript screen deviceXDPI, deviceYDPI, logicalXDPI, logicalYDPI

@March 15, 2008, 1:22 a.m.
deviceXDPI, deviceYDPI, logicalXDPI, logicalYDPIFirefox/Netscape/NN n/a IE 6(Win) Chrome/Safari/DOM n/a  

Read-only  

All four properties concern themselves with the dots-per-inch resolution of display screens along the horizontal (x) and vertical (y) axes. A device density property returns the actual pixel density of the current display screen, as detected by the operating system. The logical density is the "normal" pixel density that most users and page authors work with (typically 96 dots per inch horizontally and vertically). These two sets of properties let scripts examine whether the user has a higher-than-usual pixel density display, which could make fixed-size items, such as images and pixel-sized fonts, appear uncomfortably small on the screen. In such cases, scripts can determine a scaling factor between the device and logical densities, and apply that factor to the style.zoom property of critical elements (or the entire document.body, for that matter). Users of high-density display systems may already have their IE application preferences set to automatic scaling, so these calculations aren't necessary.

 
Example
 
var normDPI = 96;
if ((screen.deviceXDPI == screen.logicalXDPI) && (screen.deviceXDPI > normDPI)) {
    document.body.style.zoom = normDPI / screen.logicalXDPI;
}
 
Value

Integer.

 
Default

96


Powered by Linode.