How to detect if pointer coarse or fine

Question

I read this about interaction media which is explain how css can detect if pointer is touchscreen or not. It's using @media query like

@media (pointer: coarse){ body{ // do something } }

but I just wonder how to implementing it using javascript ot JQuery, is it possible?

Thank you

Inversion · Accepted Answer · 2017-11-24 11:43:38Z

23

is_fine = matchMedia('(pointer:fine)').matches is_coarse = matchMedia('(pointer:coarse)').matches

Works in Chrome for me.

answered Nov 24, 2017 at 11:43

Inversion

1,26014 silver badges21 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Lukáš Řádek Over a year ago

Alternatively you can style some element with CSS and check whether that style is applied via JS.

Mikko Rantalainen Over a year ago

window.matchMedia() should be well supported: developer.mozilla.org/en-US/docs/Web/API/Window/matchMedia – basically if the CSS method works, the matchMedia() should also work.

Jake Over a year ago

Would be nice if there was a more native JavaScript API for determining input devices, without having to go via ` matchMedia`, but I could not find one.

Collectives™ on Stack Overflow

How to detect if pointer coarse or fine

1 Answer 1

3 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Linked

Related