Jak przenieść element w ruchu przekątnej w jQuery?

Question

Wiem, jak poruszać się w górę iw dół elementu w jQuery.

$("#div").animate({"left": "+=100"}, 1000); //move 100px to the right 

Ale nie mam pojęcia, do poruszania się w ruchu po przekątnej. Robię szachownicę i nie wiem, jak przenieść Bishopa z efektem. Proszę spojrzeć na następujący adres URL: http://chess.diem-project.org/

Podobało mi się to ... ale nie jest to właściwy sposób.

for(var i = 0;i<50;i++){ // move down and move right 1 pixel at a time to get effect 
$("#div").animate({"left": "+="+x}, 1); 
$("#div").animate({"top": "+="+x}, 1); 
} 

Masz pomysł? Naprawdę doceniam twoje pomoce!

Answer 1

Czy to tak:

$("#div").animate({left: '+=50', top: '+=50'}, 1000); 

Chcesz jedna animacja się tam dostać ... A dla kolejek pętli 100 animacje w Twoim przypadku, wystarczy jeden :) See a demo here