I've certain functionality on a web page that I'd like to render only if the browser doesn't support touch. After a lot of googling, I've found out the following code, and it works, but it just works on Android, and doesn't work on iOS devices:
function supportsTouch() {
return ('onstarttouch' in window) || (navigator.maxTouchPoints > 0) || (navigator.msMaxTouchPoints > 0)
}
I've also tried Modernizr , and written the following script to detect the touch capability on a device:
function supportsTouch() {
if (Modernizr.touchevents) {
return true;
}
}
But it works on neither OS. I know that it's not possible to actually detect that either a devise responds to physical touch or not according to this , but is there any hack that could possibly tell me about touch capability of a devise on both platforms: iOS and Android?
Note: I'd not go with the option of media queries, because that would contaminate my web application as anyone can change the width of a browser on a desktop machine.
After a lot of struggle, I finally managed to get a few lines of code that detect touch for Android as well as iOS devices, and here is the final function:
function supportsTouch() {
return ('ontouchstart' in window) || (navigator.maxTouchPoints > 0) || (navigator.msMaxTouchPoints > 0) || (typeof el.ongesturestart == "function")
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.