Sometimes, we want to check for real touch support on a browser with JavaScript.

In this article, we’ll look at how to check for real touch support on a browser with JavaScript.

How to check for real touch support on a browser with JavaScript?

To check for real touch support on a browser with JavaScript, we can use the matchMedia global function.

For instance, we write:

const isTouch = window.matchMedia("(any-hover: none)").matches
console.log(isTouch)

to call window.matchMedia with "(any-hover: none)" to check if the device the code is running on is a touch device.

If matches is true, then the code is running on a touch device.

Conclusion

To check for real touch support on a browser with JavaScript, we can use the matchMedia global function.