フィルタリングされたポートフォリオギャラリー - jqueryでイージングアニメーション

Question

現在フィルタリングされたギャラリーで作業しています。私はフレームワークとしてブートストラップポートフォリオギャラリーを使用しています。私はフィルタリング機能を持っていますが、フィルタタブをクリックするとアニメーションが簡単になるようにしたいと思います。 jqueryでこれを行う方法はありますか？

ここに私のコードは、これまでのところです：

$(function() { 
    var selectedClass = ""; 
    $(".filter").click(function(){ 
    selectedClass = $(this).attr("data-rel"); 
    $(".work").fadeTo(100, 0.1); 
    $(".portfolio-item").not("."+selectedClass).fadeOut().removeClass('scale'); 
    setTimeout(function() { 
     $("."+selectedClass).fadeIn().addClass('scale'); 
     $(".work").fadeTo(300, 1); 
    }, 300); 
    ); 
}); 

それはaddClass('scale')に.animate({transform scale(1)});を追加し、CSSの.scaleのために0にスケールを変更することは可能ですか？私は変換タグに.animateをどのように使うべきかについてはあまりよく分かりません。

Answer 1

を使用できcsstransition

.scale { 
    transition: transform 1s; 
    transform: scale(1); 
} 
.portfolio-item:not(.scale) { 
    transition: transform 1s; 
    transform: scale(0); 
}