Javascript, detect touch devices

Question

I'm using this function to detect if the device is a touch device:

function is_touch_device()
{
    return !!('ontouchstart' in window) || !!('onmsgesturechange' in window);
};

Got this function from here: What's the best way to detect a 'touch screen' device using JavaScript?

But since Chrome 25 (25.0.1364) it returns true on my desktop which isn't a touch device. Also I've updated IE9 to IE10 and it returns true in IE!

Searched around but couldn't find anything useful to fix this except using a something like this: http://detectmobilebrowsers.com/

What do you recommend?

I'm looking forward to your responses!

score 4 · Answer 1 · answered Apr 16 '13 at 17:50

The code works just fine, the browser is able to understand touch events, just because your screen isn't touchable doesn't mean that the browser doesn't support the functionality. What you are looking to test is a hardware capability which isn't really testable. You can always use different ways though of seeing if the user is actual using a touch interface after touching it once, such as this article describes, or many others that larger libraries use such as Modernizer.

As a reference the code actually used in the article above is:

function isTouchDevice() {
   var el = document.createElement('div');
   el.setAttribute('ongesturestart', 'return;');
   if(typeof el.ongesturestart == "function"){
      return true;
   }else {
      return false
   }
}

score 3 · Answer 2 · answered Mar 05 '13 at 12:39

3

This seems to work:

function isTouchEnabled() { return !!document.createTouch; }

answered Mar 05 '13 at 12:39

tobi

789
7
10

1

Thanks! It works on almost everything (FF,IE,Android) excepts Chrome on my Windows desktop. – Roy Mar 05 '13 at 16:45

score 3 · Answer 3 · edited May 23 '17 at 12:22

3

You could use Modernizr to detect touch capability.

This question is very similar to What's the best way to detect a 'touch screen' device using JavaScript? and should perhaps be considered a duplicate.

edited May 23 '17 at 12:22

Community

1
1

answered Jun 12 '13 at 11:04

chos

3,431
1
12
6

Modernizr is not detecting touch devices. It only recognise touch browsers – Maciej Paprocki Sep 30 '14 at 15:02

score 3 · Answer 4 · answered Oct 05 '13 at 18:31

i was experiencing a false positive IE10 touch issue as well when I was visiting the site i've been working on from my laptop. The original is_touch_device method, i used basically the same thing. I modified the latter half of that statement to be the following:

function is_touch_device()
{
    return !!('ontouchstart' in window) || (!!('onmsgesturechange' in window) && !!window.navigator.maxTouchPoints);
}

window.navigator.maxTouchPoints seems to be something specific in IE10 based on this post: http://msdn.microsoft.com/en-us/library/hh772144(v=vs.85).aspx

score 0 · Answer 5 · answered Jul 15 '13 at 08:40

0

You can use 51dergees.mobi for detection on the server appropriately changing page view. It has HasTouchScreen, IsSmartPhone, IsTablet properties etc.

answered Jul 15 '13 at 08:40

Volodymyr

508
1
8
16

Thanks but I'm searching for touch screen detection, not device detection – Roy Jul 16 '13 at 19:29
also to note, doing server-side device detection doesn't really work if you have a cdn caching your site. – hellatan Nov 25 '13 at 05:35

Javascript, detect touch devices

5 Answers5

Linked