3

How should touch-enabled devices be differentiates between pure touch and ones that also have a mouse? (like some of today's laptops)

There is a need to give all mouse functionality a priority in an application, and if the device running the app has only touch support, to change the functionality.

If a touch-device also has a mouse pointer, logic suggests the app should consider that device as a normal desktop, and might add touch support as well, but the styling itself should respond to mouse events.

normal touch detection is achieved like so: 'ontouchend' in document;

One way to detect if the computer is desktop might be to check the screen resolution:

window.screen.width >= 1280 // desktop

but that is not so good because some devices might have very large viewport resolution, and some laptops might have low resolution...

Sam Hanley
  • 4,707
  • 7
  • 35
  • 63
vsync
  • 118,978
  • 58
  • 307
  • 400

1 Answers1

5

After some research, I have found that the best solution was to use this code:

https://github.com/matthewhudson/device.js

So, the way it works, is by giving the body element class names which represent the device and orientation, and with that I can pretty much guess if the user has a mouse. (class desktop is applied)

vsync
  • 118,978
  • 58
  • 307
  • 400
  • what about touch screen desktop,laptop monitors – Muhammad Umer Dec 27 '14 at 21:34
  • what about them? try and see – vsync Dec 27 '14 at 21:35
  • 1
    lets say you detect mouse and enhance ui for mouse, but user is using monitor for navigating, and wanted it to work like on tablet. – Muhammad Umer Dec 27 '14 at 21:50
  • you need to have 3 modes, one for only mouse, one for only touch and one for both, which is the most difficult to create. Do you have a more specific question? – vsync Dec 27 '14 at 21:53
  • 1
    yea lets say i want vertical navigation menu to move opposite of mouse, as in mac, to assist user reach their target. But if user is using touch then i just want them to drag menu up and down. Now i have seen a new feature that's not touch, click or drag. It's hover. In some samsung phones. This is akin to moving mouse...lets ignore that for now – Muhammad Umer Dec 27 '14 at 21:56
  • 2
    I don't understand what is your question? implementation of use-cases is irrelevant to this question. It's about detection of device capabilities only. – vsync Dec 27 '14 at 22:30