You are here: Reference > JavaScript > client-side > browser > properties > systemXDPI (screen)

systemXDPI property (screen)

Browser support:
Returns the number of dots per inch (DPI) of the display screen along the horizontal (x) axis at normal zoom level.
Note: The systemXDPI property is supported in Internet Explorer from version 8.
The user has the ability to zoom in or out a web page (CTRL and +, CTRL and -). The current number of dots per inch depends on the magnification of the web page. The value of the systemXDPI and systemYDPI properties are independent from the magnification of the web page. If you need the number of dots per inch depending on the current magnification of the web page, use the deviceXDPI and deviceYDPI properties.


You can find the related objects in the Supported by objects section below.
This property is read-only.

Possible values:

Integer that represents the horizontal DPI. Typically 96 dots per inch.
Default: this property has no default value.

Example HTML code 1:

This example illustrates the use of the systemXDPI property:
    <script type="text/javascript">
        function GetDPI () {
            var message = "";
            if ('deviceXDPI' in screen) {
                message += "The system horizontal DPI: " + screen.systemXDPI + "<br />";
                message += "The system vertical DPI: " + screen.systemYDPI + "<br />";
                message += "The current horizontal DPI: " + screen.deviceXDPI + "<br />";
                message += "The current vertical DPI: " + screen.deviceYDPI + "<br />";
                message += "The logical horizontal DPI: " + screen.logicalXDPI + "<br />";
                message += "The logical vertical DPI: " + screen.logicalYDPI + "<br />";
            else {  // Firefox, Opera, Google Chrome and Safari
                message = "Your browser does not support this example!";

            var info = document.getElementById ("info");
            info.innerHTML = message;
<body onload="GetDPI ()">
    <div id="info" style="background-color:#e0b0b0; width:250px"></div>
    Use the CTRL and + keys to zoom in and the CTRL and - keys to zoom out.
    Refresh the page (F5) after zooming.
Did you find this example helpful? yes no

Supported by objects:

Related pages:

External links:

User Contributed Comments

Post Content

Post Content