jquery touch events
you can easily build your own touch events using the following events
For example, the touchstart
For example, the touchmove
jQuery Mobile offers several custom events that build upon native events to create useful hooks for development.
Which is also work on IOS devices as well.
Touch events
Virtual mouse events
- touchstart
- touchmove
- touchend
- touchcancel
For example, the touchstart
$(document).on({ 'touchstart' : function() { /* do something... */ } });Using Javascript
For example, the touchmove
document.addEventListener('touchmove', function(e) { e.preventDefault(); var touch = e.touches[0]; alert(touch.pageX + " - " + touch.pageY); }, false);
<div>X: <span id="xtext">0</span> </div> <div>Y: <span id="ytext">0</span> </div> <div>Event: <div id="eventName"></div> </div>
function doTouch(name, e) { e.preventDefault(); var touch = e.touches[0]; if (name != 'touchend') { document.getElementById("xtext").innerHTML = touch.pageX; document.getElementById("ytext").innerHTML = touch.pageY; } document.getElementById("eventName").innerHTML = name + ' ' + document.getElementById("eventName").innerHTML; } document.addEventListener('touchstart', function (e) { doTouch('touchstart', e); }, false); document.addEventListener('touchmove', function (e) { doTouch('touchmove', e); }, false); document.addEventListener('touchend', function (e) { doTouch('touchend', e); }, false);
jQuery Mobile offers several custom events that build upon native events to create useful hooks for development.
Which is also work on IOS devices as well.
Touch events
- tap
- taphold
- swipe
- swipeleft
- swiperight
Virtual mouse events
- vmouseover
- vmouseout
- vmousedown
- vmousemove
- vmouseup
- vclick
- vmousecancel
jquery touch events
Reviewed by Bhaumik Patel
on
7:50 PM
Rating: