Search code examples
javascriptscreen-resolution

How to detect the screen resolution with JavaScript?

Is there a way that works for all browsers?

Solution

  • original answer

    Yes.

    window.screen.availHeight
window.screen.availWidth

    update 2017-11-10

    From Tsunamis in the comments:

    To get the native resolution of i.e. a mobile device you have to multiply with the device pixel ratio: window.screen.width * window.devicePixelRatio and window.screen.height * window.devicePixelRatio. This will also work on desktops, which will have a ratio of 1.

    And from Ben in another answer:

    In vanilla JavaScript, this will give you the AVAILABLE width/height:

    window.screen.availHeight
window.screen.availWidth

    For the absolute width/height, use:

    window.screen.height
window.screen.width