jQuery touch draggable responsive scroller/filmstrip/carousel?

Question

I'm looking for a touch enabled, draggable, responsive jQuery scroller / filmstrip / carousel / slider for showing horizontal scrollable list of items (e.g. for featured products in eshop, recently added photos to database etc.).

It would look similar to an image scroller in Apple's App Store on every app's page. I don't want a typical slider with one big image seen at one time. I want to see the images next to each other where user can easilly scroll between them.

By draggable I mean drag'n'drop for scrolling not moving items from the list to elsewhere. See below.

Strict requirements

• jQuery based (or library independent)
• responsive (not fixed width)
• link and title to every image
• draggable scrolling - working with mouse and finger - I drag item, move and drop and the list would mooooove and then stop. Just like scrolling on smart phones but working even with mouse.
• some API that would allow me to load more items when end of list is reached (not as strict requirement, I guess I might live witout it); it could be done if the scroller detects when user reached the end of the list and so the scroller calls my function to append more items

Nice to have

• images can have variable width
• autoplay - move from one item to another or slowly move pixel by pixel
• set min and max number of visible items
• when user scrolls and the list is rolling, a scrollbar appears

For start, I've implemented FlexSlider 2 carousel on my site. Touch gestures work, but mouse gestures/scrolling don't. FlexSlider is a slider not scroller :/ Otherwise FlexSlider would scratch my itch.

Post links please, I'll check it. Let this be a valuable list of best jQuery scrollers for other webdesigners.

Thank you everyone!

Answer 1

Try jquery plugin (jquery.nicescroll.js) .It support for touch devices also.

http://areaaperta.com/nicescroll/

http://code.google.com/p/jquery-nicescroll/downloads/list