detect screen density using javascript on mobile devices?

Question

I was wondering if it is possible to detect the screen density from a web page by using javascript and/or some sort of server checking based on http headers on PHP. My goal is to check if the user is accessing the site from a tablet, phone or computer to adjust some button sizes - imagens on a html5 canvas. Exact pixel values may lead to buttons too small or too big depending on the screen density...

Answer 1

I think most mobile browsers support window.devicePixelRatio.

Answer 2

Most browsers support devicepixelratio with the exception of Internet Explorer versions 8 through 10. Thankfully as of January 12th 2016 all those versions have been officially deprecated and will no longer be supported by Microsoft with security updates or technical support.