필터링 된 포트폴리오 갤러리 - jquery로 easing 애니메이션

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); 
}