How to add touch events [Swipe left / right] to the image gallery

Question

I am working on the image gallery [html5] and working fine in the desktop version, I would like to add touch-screen based events for Ipad / Tablet devices.

Can you suggest how to add touch based events using javascript / jquery.

Thanks, Shrinivas

Answer 1

This jQuery plugin works well. http://www.netcu.de/jquery-touchwipe-iphone-ipad-library Easy to use. Example:

$('.slideshow').touchwipe({ wipeLeft: function() {$('.slideshow').cycle('next');}, wipeRight: function() { $('.slideshow').cycle('prev');}, min_move_x: 60 }); 

Answer 2

You can use this function

swiperight or other direction

 // jquery mobile $("#id").swiperight(function() { //do some with $.mobile.changePage function }); $("#id").swipeleft(function() { //do some $.mobile.changePage function }); // javascript document.ontouchmove = function(e) { var target = e.currentTarget; while(target) { if(checkIfElementShouldScroll(target)) return; target = target.parentNode; } e.preventDefault(); };