CSS - pointer
pointer is a CSS media feature that can be used to check whether the primary input mechanism is a pointing device, and if so, how accurate it is.
Example
CSS
Copy Code
<!-- CSS media query within a stylesheet --> <style> @media (pointer: coarse) { input[type="checkbox"], input[type="radio"] { min-width:30px; min-height:40px; background:transparent; } } </style>
Description
pointer is a CSS media feature that can be used to check whether the primary input mechanism is a pointing device, and if so, how accurate it is.
Browser Compatibility
| Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|
| Basic support | 38 | No support[2] | Nightly build | ? | 9.1 [1] |
| Feature | Android | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|
| Basic support | ? | No support[2] | ? | ? | 9.3 |
[1]: Implemented in WebKit bug #134822.
Specifications
| Specification | Status | Comment |
|---|---|---|
| Media Queries Level 4 The definition of 'pointer' in that specification. |
Working Draft | Added in Media Queries Level 4 |
| Value | Meaning |
|---|---|
none |
The primary input mechanism of the device does not include a pointing device. |
coarse |
The primary input mechanism of the device includes a pointing device of limited accuracy. |
fine |
The primary input mechanism of the device includes an accurate pointing device. |
License
© 2016 Mozilla Contributors
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-us/docs/web/css/@media/pointer