Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>Some time ago i wrote a custom touch/mouse event system witch preserves scrolling and everything else like normal but it adds new events based on he devices.Wich respectively use the mouse to create the swipes &amp; clicks or the touches.it also does all the math outside the mousemove / touchmove to leave this function lagfree.</p> <p>first i checked which tipe of os i have (in your case you need to change this line to make it work in win8)</p> <pre><code>(/Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent)?'touch':'mouse') </code></pre> <p>then i created an array containing the various functions for mouse and touch events ...</p> <p>it creates 6 new events.</p> <p><em>fc:</em> fastclick (especially for ios devices else the click takes 500ms) 50ms</p> <p><em>sfc:</em> superfastclick (this is for fixed elements , its basically on touchstart) 0ms</p> <p>not tu use when you also scroll.</p> <p>and the various swipes <em>swl,swr,swu,swd</em> (swipeleft,right,up &amp; down)</p> <p>the mouse reacts like a normal touch event</p> <p>if you click->hold->move right->release it gives you a swipe right event.</p> <p>told that in your case you need both.(wich could be a problem... dunno) but you can do that just by deleting this line (also remove the device check mentioned on top)</p> <pre><code>for(var a in f[m]){d.addEventListener(a,f[m][a],false);} </code></pre> <p>and replace it with</p> <pre><code>for(var a in f['mouse']){d.addEventListener(a,f['mouse'][a],false);} for(var a in f['touch']){d.addEventListener(a,f['touch'][a],false);} </code></pre> <p>i can't test it on win 8 touch ... try it.</p> <p><a href="http://jsfiddle.net/3u5pJ/" rel="nofollow">http://jsfiddle.net/3u5pJ/</a></p> <p><strong>To test just swipe or click on the result box looking at the console.</strong></p> <p>ps: As ie 10 is standardized everything should work like in all new modern browsers.this code is not meant to be working on obsolete browsers.</p> <p><strong>EDIT</strong></p> <p>this example adds touch events on the mouse and the touches.</p> <p><a href="http://jsfiddle.net/3u5pJ/1/" rel="nofollow">http://jsfiddle.net/3u5pJ/1/</a></p> <p><strong>To test just swipe or click on the result box looking at the console.</strong></p> <p>yeah and if you use that code u should not use click events as they are very bad in touch devices , but use the custom fc or sfc.</p> <p>usage:</p> <pre><code>element.addEventListener('swl',handlerFunction,false)//swipeleft </code></pre> <p>if you don't understand something just ask.</p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

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