jQueryで複雑なアニメーションを管理する

Question

要素が上下にスライドし、CSSプロパティが操作されるなど、かなり複雑なアニメーションをWebサイトで実行する必要があります。私はどのようにこれをエレガントな方法で行うのだろうか。

アクションfire onclickを実行すると、もう一度クリックすると、サイトが元の状態に戻るまですべてが元に戻ります。私がやりたくない何

は）

$(somebutton).onclick(function() { 
     if($(this).hasClass("clicked") { 
      $(this).slideDown(); 
      $('#that').show(); 
      $('#button').css("position","absolute"); 
      // more things going on 
      } else { 
      // revert all things gone on 
      $(this).slideUp(); 
      $('#that').hide(); 
      $('#button').css("position","static"); 
      } 

}のような関数を記述しています。

これは、これらのステートメントをすべて2回書きたくないということです。つまり、ほとんどのアニメーションは70％で同じです。私はそれを何度も何度も書きたくはありませんでした。

私が考えていたのは、アニメーションキューのようなものでした。私は操作したり、ポップしたり、シフトしたり、最も重要な復帰を行うことができます。

• カスタムキューがデキューされると、私がかつて要素をアニメーション化することができますつまり、任意のより多くを提示されていませんが、私ができる：機能が、私は立ち往生一点があります - 私はjQueryのキューを（）が発見しました例えば、say say

  myQueue.queue（ 'animate'）。

この時点では空であるため、myQueueが発生した後。

この長い説明は、この単純なキューの問題だけではありません。それを達成するためのより良い方法のアイディアを提案するための招待状でもあります。

Answer 1

私はそこに解決策がないと思います。アニメーションは反転操作を認識していないので、元に戻すことは簡単な作業ではありません。それは、あなた自身でそのようなシステムを書くことは、すべて複雑ではないはずだと言いました。結局のところ、それぞれのアニメーションは非常に単純で反転操作は容易に生成可能でなければならない。