javascript - Jqueryは、計算されたマージンに達するまでonclickで要素を移動し、その後停止します

Question

スライドが入っているコンテンツ div にナビゲーション ボタンがマージン左を追加する短いコンテンツ スライダーを作成したいと考えています。

すべて正常に動作しますが、一定のマージンに達したらアニメーションを停止したいと考えています。

var allElements = $('figure').length
var singleWidth= $('figure .contents').width();
var moveMax = allElements * singleWidth
var moveElement = '#sliderwrapper'
var actualMargin = $(moveElement).css('margin-left');


$('#navigation span.next').click(function() {
     if (actualMargin < moveMax) {
        $('#sliderwrapper').animate({"margin-left": '+='+singleWidth});
     }
     else {
        $('#sliderwrapper').stop();
    }
});

$('#navigation  span.previous').click(function() {
     $('#sliderwrapper').animate({"margin-left": '-='+singleWidth});
});

「actualMargin」ステートメントを計算された「moveMax」よりも短い数値に置き換えると、機能し、その逆も同様です。

何か案は？

ありがとう！

編集：これはあなたのためのフィドルです：http://jsfiddle.net/am65n/