Резиновый слайдер изображений для мобильных устройств с поддержкой touch

#jquery #html #css

Добрый день!
Подскажите пожалуйста как сделать слайдер изображений для  мобильных устройств с
поддержкой touch.
Требования:
На экране отображается одно изображение, которое масштабируется в зависимости от
размеров устройства и от ориентации устройства (сделано). 
Кроме этого, данный слайдер должен поддерживать управление жестами - touch. За раз
прокручивается по одному изображению. (не сделано)
Еще должна быть предусмотрена автоматическая прокрутка изображений, которую можно
включать/выключать в js.
Под слайдером располагаются элементы управления - круги, которые меняют свой цвет
в зависимости от текущего изображения и по клику на которые, слайдер также прокручивается.(набросал
структуру)
Вот html и css - http://jsfiddle.net/Alex83/nRq5G/
Пожалуйста, помогите реализовать это чудо.
Начал сочинять, но к сожалению, пока не получается...    

Ответы

Ответ 1

Если нужно сделать ванильным жс, есть события touchstart touchend, берете координаты
для свайпа, процентов 10% слева и 10% справа и детектите эту область
Ссылка на тач события

Ссылка на координаты