Question

31

Get screen resolution on a mobile website

rated 0 times [ 33] [ 2] / answers: 1 / hits: 55254 / 11 Years ago, fri, june 28, 2013, 12:00:00

I am designing a mobile website that has a section to download wallpapers from. In order to accommodate many users, I wish to make it possible to download a wallpaper based on the screen resolution. I want to detect resolution from JavaScript and show the appropriate wallpaper.

This is what I found online and tried and failed xD:

width  = window.innerWidth  || document.body.clientWidth

height = window.innerHeight || document.body.clientHeight;

For my SGS3, which has the resolution 720x1280 I get the 360x567.

How should I discover the resolution of the phone from JavaScript?

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

tylerdamiena

Add To Favorites

Follow

Total Points: 139

Total Questions: 90

Total Answers: 118

Location: Liechtenstein

Member since Wed, Dec 8, 2021

3 Years ago

tylerdamiena questions

1 How to access sveltekit session in endpoint?

Tue, May 3, 22, 00:00, 2 Years ago

1 React.js, Each child in a list should have a unique key prop. how to fix if key is already given

Mon, Mar 7, 22, 00:00, 2 Years ago

1 Can`t resolve image.png in styles.css

Fri, Sep 17, 21, 00:00, 3 Years ago

1 Warning: validateDOMNesting(...): < body> cannot appear as a child of < div> in React.js

Wed, May 26, 21, 00:00, 3 Years ago

1 Using readonly on a reactive object

Tue, May 26, 20, 00:00, 4 Years ago

View All

answered 11 Years ago marissatinao · Accepted Answer

You can perhaps use the screen object:

var w = screen.width;

var h = screen.height;

Update - Try to use it with the window.devicePixelRatio:

var ratio = window.devicePixelRatio || 1;

var w = screen.width * ratio;

var h = screen.height * ratio;