여러 개의 경유지/목적지를 통해 객체에 애니메이션을 적용 하시겠습니까?

Question

여기

는 'B'대상에 'A'로가는 선형 애니메이션입니다 http://jsfiddle.net/BL5cS/

상자가 'D'등을 'C'에서 'B'에서 'A'처럼 애니메이션 있도록 나는 다른 경로를 추가 할 수있는 방법 :

특급 : http://thesaurus.maths.org/mmkb/media/png/Zigzag.png

Answer 1

체인 애니메이션 :

$('.my_element').animate(...first destination...) 
       .animate(...second destination...) 
       .animate(...third destination...) 
       .animate(...fourth destination...) 

당신은 또한 그것을 배열에서 대상을 저장하고, 루프 수 있습니다.

var destinations = [ 
     {top:..., left:...}, 
     {top:..., left:...}, 
     {top:..., left:...}, 
     {top:..., left:...} 
    ], 
    element = $('.my_element'); 

$.each(destinations, function(i, v) { 
    element.animate(v) 
}); 

Here's your code 약간 수정되었습니다.