Bootstrapのcarouselをスワイプできるようにする

ARマガジンのモバイルサイトをBootstrapでリニューアルして2週間。

carouselをスワイプ出来たら良いなぁと思い、ToucheSwipte.jsで実現する方法を見つめました。

紹介されているサイト（本家かなぁ？）が
http://labs.rampinteractive.co.uk/touchSwipe/demos/
です。

お目当てのToucheSwipte.jsのダウンロードは
https://github.com/mattbryson/TouchSwipe-Jquery-Plugin
から行いました。

ToucheSwipte.js　をインクルードして

$(document).ready(function(){
});

の中に書くのは

$(".carousel-inner").swipe( {
    swipeLeft:function(event, direction, distance, duration, fingerCount) {
        $(this).parent().carousel('next'); 
    },
    swipeRight:function(event, direction, distance, duration, fingerCount) {
        $(this).parent().carousel('prev'); 
    }
});

だけ、英語のサンプルではswipeLeftのアクションがcarousel('prev');になっていたけど、めくる感じより、引っ張る感じの方が良いと多数決でcarousel('next'); にしました。

実際の実装結果文壇ビストロ　ELSKA（エルスカ）で確認できます。