jquery - jquery アニメーションを元に戻す

Question

4 つの div が別の div の「後ろ」にスライドするアニメーションを作成しました。すべての div を再度表示するリセット ボタンが必要なので、アニメーションを元に戻すことができると考えました。たとえば、左に -100px をアニメーション化した場合、右に +100px をアニメーション化できると考えました。しかし、そのアニメーションは何もしません。私はjsフィドルを作りました。コードが多すぎる場合はお知らせください。

http://jsfiddle.net/R2ARv/3/

助けてくれてありがとう。

Answer 1

+= と -= を使用すると、次のように反対のアニメーションを作成できます。

left -=100px
left +=100px

left -=100px の反対のアニメーションは left +=100px です。

使用していた通常の配置を使用するには、以前の左の位置が何であったかを知るか、保存して、そこに戻す必要があります。

したがって、 left が以前にゼロだった場合、これらは互いに逆になります。これは、以前の位置に対する相対位置ではなく、絶対位置であるためです。

left -100px
left 0

Answer 2

左: -100px を逆にしたい場合は、左: +100px または右: -100px を実行します。

左: -100px は右: +100px と同じです。

Answer 3

http://jsfiddle.net/HxxUp/

左を 0 に戻すだけです。これにより、要素が完全に配置されていない場合、要素が元の位置に再配置されます。

$("#back-to-main").click(function(){
        $("#div-link2").animate({"left": "0"}, 1500);
        $("#div-link3").animate({"left": "0"}, 1500);
        $("#div-link4").animate({"left": "0"}, 1500);
        $("#div-link5").animate({"left": "0"}, 1500);

       //other code
});