jquery - スライダーでの jQuery + css3 トランジション

Question

アニメーションは正常に動作しますが、translateX の正しいピクセルを計算するには助けが必要です。

現在、最初のクリックのみを計算します.next .prev

$('.prev').click(function(e) {
    e.preventDefault();
    var idx = $('.wrap.fadeIn').addClass('fadeout').removeClass('fadeIn').css("transform", "translateX(" + $(this).index() * 160 + "px)").index() - 1;
    $('.wrap').eq(idx).addClass('fadeIn').removeClass('fadeout').css("transform", "translateX(" + $(this).index() * -0 + "px)");
    updateNav();
});

$('.next').click(function(e) {
    e.preventDefault();
    var idx = $('.wrap.fadeIn').addClass('fadeout').removeClass('fadeIn').css("transform", "translateX(" + $(this).index() * -160 + "px)").index() + 1;
    $('.wrap').eq(idx).addClass('fadeIn').removeClass('fadeout').css("transform", "translateX(" + $(this).index() * -160 + "px)");
    updateNav();
});

http://jsfiddle.net/JQq5n/462/ (Firefox)