【解決】MixItUp.jsで要素を絞り込んだときのアニメーションがおかしい

要素をタイルで並べておいて、フィルタをかけたりソートしたりできる、便利なjQueryプラグイン「MixItUp.js」。
これを使ったところ、アニメーションがおかしくなるという現象が起こりました。
発生するのはこんな感じ。

１．フィルタを設定してあるボタンをクリック
２．条件に応じて要素の表示が切り替わり、移動のアニメーション開始
３．一度移動が終了
４．要素が再びおかしな位置にワープし、アニメーションがもう一度発生

要するに、ちらつくといいますか、一回終わったのにまたパパっと２回目のアニーションが始まってしまうのですね。
で、これ、原因は簡単でして、CSSのtransitionが指定してあると発生します。

transitionはCSSの設定が変わったときに、一瞬で切り替わるのではなく、アニメーションしながら切り替わるようにする設定です。
MixItUpの場合は、移動はjQueryで制御しているのに、CSSのtransitionも入っていると両方が動作してしまうということですね。

transitionを設定するときはめんどくさいのでallとしてしまうことが多いと思いますが、jQueryのアニメーションと競合しがちなので最低限の要素に設定したほうが安全です。

また、もちろん不要なら削除しましょう。