어떻게 jQuery 애니메이션 기능을 연결할 수 있습니까?

Question

두 개의 구분이 있고 애니메이션 기능을 연결하려고합니다. 하지만 첫 번째 애니메이션 함수 콜백에서 값을 업데이트하고 첫 번째 부분에 표시 할 논리가 있습니다. & 완벽하게 작동합니다. 문제는 첫 번째 부문의 애니메이션이 끝나고 두 번째 부문이 시작되지 않는 경우입니다. 첫 번째 콜백에서 두 번째 div 애니메이션 함수를 전달했지만 아무 것도 발생하지 않습니다.

jQuery 코드 :

$('#jq').animate({marginTop:-250+'px',height:250+'px'},2000,'easeOutBack',function(e){ 

       var counter = 0; 
       var height = $(this).height(); 
       counter+=height/50; 
       $('#jq-rating').text(counter); 
       //$(noid).append(counter); 
      $('#wordpress').animate({marginTop:-250+'px',height:250+'px'},2000,'easeOutBack',function(e){ 

       var counter = 0; 
       var height = $(this).height(); 
       counter+=height/50; 
       $('#wp-rating').text(counter); 
       //$(noid).append(counter); 

     }); 


     }); 

My JSFiddle code

Answer 1

그것은 작동,하지만 당신은 div의 모두가 서로 중복되기 때문에 볼 수 없습니다.

이 CSS를 추가

#wordpress{ 
    margin-left:60px 
} 

업데이트 jsfiddle : http://jsfiddle.net/ashishanexpert/LSE8w/13/