Databases
StackOverflow2013
Postsdbo
POListening to mousedown AND touchstart on devices that use touch and a mouse (e.g. Surface)
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POListening to mousedown AND touchstart on devices that use touch and a mouse (e.g. Surface)
    primarykey
    data
    text
    <p>So, I've run across an interesting problem while working on a Web application for the Microsoft Surface.</p> <p>I want to add event listeners for when a user interacts with a DOM element. Now I can do:</p> <pre><code>if ('ontouchstart' in document.documentElement) { //Attach code for touch event listeners document.addEventListener("touchstart" myFunc, false); } else { //Attach code for mouse event listeners document.addEventListener("mousedown" myFunc, false); } </code></pre> <p>If the device didn't have a mouse input, this problem would be simple and the above code would work just fine. But the Surface (and many new Windows 8 computers) have BOTH a touch and mouse input. So the above code would only work when the user touched the device. The mouse event listeners would never be attached.</p> <p>So then I thought, well, I could do this:</p> <pre><code>if ('ontouchstart' in document.documentElement) { //Attach code for touch event listeners document.addEventListener("touchstart" myFunc, false); } //Always attach code for mouse event listeners document.addEventListener("mousedown" myFunc, false); </code></pre> <p>Devices that don't support touch wouldn't have the events attached, but a device that uses touch will register its handlers. The problem with this though is that <code>myFunc()</code> will be called twice on a touch device:</p> <ol> <li><code>myFunc()</code> will fire when "touchstart" is raised</li> <li>Because touch browsers typically go through the cycle <em>touchstart</em> -> <em>touchmove</em> -> <em>touchend</em> -> <em>mousedown</em> -> <em>mousemove</em> -> <em>mouseup</em> -> <em>click</em>, <code>myFunc()</code> will be called again in "mousedown"</li> </ol> <p>I've considered adding code to<code>myFunc()</code> such that it calls <code>e.preventDefault()</code> but this seems to also block <em>touchend</em> as well as <em>mousedown</em> / <em>mousemove</em> / <em>mouseup</em> on some browsers (<a href="http://code.google.com/p/android/issues/detail?id=19827">link</a>).</p> <p>I hate doing useragent sniffers, but it seems as if touch browsers have variations in how touch events are implemented.</p> <p>I must be missing something because it seems that surely these JavaScript implementations were decided with possibility of a browser supporting both a mouse and touch!</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PTQuestion
    1. USJasonMArcher
    1. USuserx
    plurals
    1. PL
      singulars
      1. LTLinked
    2. PL
      singulars
      1. LTDuplicate
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    2. PO
      singulars
      1. PTAnswer
    3. PO
      singulars
      1. PTAnswer
    1. VO
      singulars
      1. POListening to mousedown AND touchstart on devices that use touch and a mouse (e.g. Surface)
      1. USJames M. Greene
      1. VTFavorite
    2. VO
      singulars
      1. POListening to mousedown AND touchstart on devices that use touch and a mouse (e.g. Surface)
      1. This table or related slice is empty.
      1. VTUpMod
    3. VO
      singulars
      1. POListening to mousedown AND touchstart on devices that use touch and a mouse (e.g. Surface)
      1. This table or related slice is empty.
      1. VTUpMod
    1. COWhat does this have to do with Android, considering that the Surface does not run Android?
      singulars
      1. POListening to mousedown AND touchstart on devices that use touch and a mouse (e.g. Surface)
      1. USCommonsWare
    2. CO@CommonsWare - My question is pertinent to all touch devices that support a mouse as well, hence it seems applicable to Windows 8 and Android.
      singulars
      1. POListening to mousedown AND touchstart on devices that use touch and a mouse (e.g. Surface)
      1. USuserx
    3. COYeah, what about chromeOS?
      singulars
      1. POListening to mousedown AND touchstart on devices that use touch and a mouse (e.g. Surface)
      1. USChris Love
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload