res
v0.4.0 device screen browser resolution detection responsive retina device-pixel-ratio ender and 4 more...
res
CSS resolution detection in JavaScript
npm install res --save
API
res.dpi()
- Get resolution in dpi
- @return number
res.dpcm()
- Get resolution in dpcm
- @return number
res.dppx()
- Get resolution in dppx
- @return number
Usage
var res = require('res')
res.dppx() // 1
res.dpi() // 96
res.dpcm() // 37.79527559055118
Technical notes
- dppx equals
devicePixelRatio - dppx is the preferred resolution unit for web design
- User zoom affects resolution
Use with care
res was mainly written for investigative purposes. Making retina design accommodations can be impractical. Consider alternatives to resolution detection.
Example outputs
| Device | res.ddpx() |
res.dpi() |
res.dpcm() |
|---|---|---|---|
| desktop at default zoom | 1 | 96 | 37.79527559055118 |
| iPhone 4s at default zoom | 2 | 192 | 75.59055118110236 |
Compatibility
Browsers with resolution detectable by res
- Webkit (Chrome/Safari/Android)
- Firefox 18+
- Opera 11.1+ (Presto 2.8+)
- IE 6+
Methods return 0 where undetectable.
Related resources
License
MIT
