Something like this? http://jsfiddle.net/6jxbv/119/
I’m using Hammer(element).on("event", callback); to get the result. In this case, I added the swipeleft and swiperight events.
The script uses the syntax described above to add events like:
drag, dragstart, dragend, dragup, dragdown, dragleft, dragright
swipe, swipeup, swipedown, swipeleft, swiperight
If you want to use it with jQuery, they provide this syntax (which is kind of awkward if you ask me):
$(elementOrSelector).hammer().on("event", function(event) {
//callback
});
But you have to include the jquery.hammer.js plugin
Try reading the docs for more info
EDIT:
Here, you can see an example using swipe and drag. Take into account that swipe is a fast movement (with the mouse or touch) and drag is pressing and moving (so the implementation it’s not correct, but I’ll leave the animate to you. 🙂 )
http://jsfiddle.net/uZjCB/183/ and full screen http://jsfiddle.net/uZjCB/183/embedded/result/
Hope it helps