どもです。
カルーセルやスライドショーを作るとき、僕は基本的には自作jsを使います。
既成品のプラグインは作成元が日本でなくて権利関係がよくわからなかったり、汎用的故に余分なプログラムが入っていたりするのであまり使用したくないんですよね。
当然、僕の技術の及ばない範囲ではお世話にならざるを得ないのですが、
その「及ばない範囲」は狭いに越したことはない。
ので、今回はカルーセルやスライドショーをフリック（スマホのドラッグ的な）対応させたいと思います。
これらの解決法を載せているサイトは様々あったのですが、どうにも上手く行かないケースが多かったので、jsの書き方によって相性があるのかもしれません。
$('フリックする要素').bind('touchstart', function() {
startX = event.changedTouches[0].pageX;//フリック開始時のX軸の座標
});
$('フリックする要素').bind('touchmove', function(e) {
endX = event.changedTouches[0].pageX;//フリック終了時のX軸の座標
diffX = Math.round(startX - endX);//フリック開始時の座標-終了時の座標=フリックの移動距離
});
$('フリックする要素').bind('touchend', function(e) {
if (diffX > 100) {
//右から左へフリックしたときの挙動
} else if (diffX < -100) {
//左から右へフリックしたときの挙動
};
});
大抵の場合は、右から左へフリックした場合は中身の要素は右向きにスクロールします。
参考サイトは以下です。
Web Design Note