jquery 슬라이드 전환 및 회전 전환 애니메이션

Question

버튼을 눌렀을 때 버튼이 있습니다. 단락을 활성화하고 버튼을 45도 회전시키고 싶으면 다시 클릭하고 단락을 닫은 다음 앞으로 움직이십시오. 45 더 많은 학위. 나는 토글 슬라이드를 사용하여 단락을 열고 닫았으며 잘 작동합니다. 비록 회전 애니메이션을 함수에 추가하는 방법을 잘 모르겠습니다. 이상적으로 가능한 경우 그냥 jquery 및 CSS 변환 사용하여 회전 싶습니다. 하지만 jQuery에서 CSS를 사용하여이 작업을 수행 할 수 없다면 괜찮습니다.하지만이 작업을 모두 하나의 기능으로 사용하고 싶습니다. 지금이 내가 가진 것입니다, 감사이 나를 도와 사전에 :

<script type="text/javascript"> 
$("#effects_of_yoga_info").click(function() { 
    $("p#effects_of_yoga_text").slideToggle("fast"); 
}); 
</script> 

effects_of_yoga_info 내가 여기

Answer 1

회전이 시도하고 싶은 것입니다. 나는 이것을 함께 모아 테스트했다.

$(document).ready(function() { 
    $('#effects_of_yoga_info').click(function() { 
     var info = $(this); 
     var rotation = parseInt(info.data('rotation')); 

     $('p#effects_of_yoga_text').animate({ 
      height: 'toggle' 
     },{ 
      step: function(now, fx) { 
       var t = fx.start == 100 ? 100 - fx.now : fx.now; 
       info.css('transform', 'rotate('+ (rotation + ((t/100) * 45)) +'deg)'); 
      }, 
      complete: function() { 
       info.data('rotation', rotation + 45); 
      }, 
      duration: 'fast'  
     }); 

    }).data('rotation', 0); 
});