Drag to change image slide with jquery like in iphone

javascript jquery slider drag swipe-gesture
esafwan picture esafwan · Aug 1, 2011 · Viewed 7.4k times · Source

Am using supersized jquery plugin for my site. It comes with button for next and previous slides. I want to implement drag to change feature in it. If some one click and move mouse to right it should act as the next slide button.

But how can i do it with jquery? How can i know when user click n drag to left/right

http://buildinternet.com/project/supersized/

Answer

Semyazas picture Semyazas · Aug 1, 2011

jQuery recognizes mouseUp, mouseDown and mouseMove as events.

You would have to capture the mouseposition on mouseDown, update the position while it's moving and compare that to your initially captured position. While this is highly theoretical, check here Recreate Iphone Swipe effect using jQuery for a live example.

Related questions

Change the Arrow buttons in Slick slider

I want to change the arrows in my slick slider but it does not change. I want the next and previous button as an image. I have tried putting it in a <style> but it still not working. …

Read More
jQuery issue - #<an Object> has no method

I've tried a veriety of jQuery plugins recently and I keep getting this error … (source: shaunbellis.co.uk) … regardless of what plugin I try to use. I've checked the links to the JS files which are all there and working …

Read More
Touch move getting stuck Ignored attempt to cancel a touchmove

I'm messing around with touch events on a touch slider and I keep getting the following error: Ignored attempt to cancel a touchmove event with cancelable=false, for example because scrolling is in progress and cannot be interrupted. I'm not …

Read More