jQueryの非表示（）、私はアニメーションとdiv要素の行を摺動い

Question

なぜこの仕事doesntの

$("#right").click(function(){ 
    $("#sliderWindow").find("img").each(function(i) { 
    var left = $(this).css("left"); 
    $("#imageContainer" + i).animate({"left": "+=220px"}, "slow"); 
    left = parseInt(left); 
    left += 220; 
    left = left + "px"; 
    $(this).css("left",left); 
    left = $(this).css("left"); 

    if(left === "1220px") { 
     //this is what doesnt work 
     $(this).css("left", "-320px"); 
    } 

）（表示その後）（アニメーション。最後のdivが絶対位置のままになったら：-1220px、それを左に移動して開始位置：-320pxに戻します。正しい位置に移動していますが、私はそれを隠すのに問題があります。

EDIT：アニメーションがCSSを変更していないように見えるため、私が非表示のdivをアニメーション化している理由があります。 CSSが変わっていないので、最後のオブジェクトをラインの前に戻すことはできません。これを達成するためにanimate（）を取得できるので、最後のdivを非表示にして、行の前に表示させようとしています。

は解決：

$("#right").click(function() { 
    $("#sliderWindow").find("img").each(function() { 
    if (this.offsetLeft >= 1220) { 
     $(this).css("left", "-320px"); 
    } 
    $(this).animate({left: "+=220px"}, "slow"); 
    }); 
}); 

Answer 1

：それは隠されていたときに、それをアニメーションなぜ

$("#right").click(function() { 
$("#sliderWindow").find("img").each(function() { 
    if (this.offsetLeft >= 1220) { 
    $(this).css("left", "-320px"); 
    } 
    $(this).animate({left: "+=220px"}, "slow"); 
}); 
}); 

Answer 2

すべてのアニメーションはすべて、即座に実行 - >あなたは

delay() 

または

setTimeout(function(){},timeInMillis); 

例えばjQueryのを使用する必要が

if(left === "1220px") { 
    var $this = $(this); 
    $this.hide(200).delay(200).animate({"left": "-320px"}, 300,function(){ 
    $this.show(); 
    }); 
} 

Answer 3

あなたがしようとしているように聞こえるので、新しい位置を設定するだけではいかがですか？

if(left === "1220px") { 
    $(this).css("left", "-320px"); 
    } 

Answer 4

まず、あなたがそれを隠した後で何かをアニメーション化することは何もできません。 :)

第2に、あなたが探しているのはアニメートのコールバック機能だと思います。 、そしてあなたはそれが消えた後、移動したい;：「絶対位置」あなたが起こるために何かをしたい場合はアニメーションは、あなたがこのようにそれを行う完了した後にのみ...

$(this).animate({"left": "-320px"}, "slow", function(){ do_something; }); 

はのは<div id="obj">がすでに持っているとしましょう。 ..

$('#obj').animate({"left": "-320px"}, "slow", function(){ $(this).hide(); }); 

Answer 5

は場合に、それは正確ではありません1220px ... ...使用して

if(parseInt(left) > 1219) { 
    $(this).css("left", "-320px"); 
} 

を試してみてください？以下でこれを解決し