[jQuery]Poruszanie divem Opcje

[murrey]

Witam mam następujący problem, chcę aby div poruszał się po oknie przeglądarki do miejsca klikniętego przez użytkownika. To potrafię zrobić ale mam problem z tym, że im odległość jest większa od aktualnej pozycji diva tym porusza się on szybciej, a ja chciałbym aby poruszał się ze stałą prędkością za każdym razem. W googlach ostatnio znalazłem rozwiązanie tego problemu ale nie zachowałem linka :/

Mam coś takiego:

[HTML] pobierz, plaintext 
$(document).ready(function() {
 $('#viewport').bind('click', function(event) {
  $('#d').animate({
   left:event.pageX,
   top:event.pageY
  }, 2000, 'linear');
 }
});
});
[HTML] pobierz, plaintext 

Ten post edytował murrey 22.01.2014, 21:49:38

[vonski]

Jeżeli chcesz żeby div zawsze poruszał się z tą samą prędkością to czas trwania ruchu nie może być stały. Musisz uzależnić czas od drogi jaką ma do przebycia element. Dlatego też musisz jakoś tę drogę wyliczyć, najlepiej chyba na podstawie współrzędnych - aktualnych (przed rozpoczęciem ruchu) i docelowych (po zakończeniu animacji). Odejmujesz od siebie współrzędne, odpowiednio |x2 - x1| i |y2 - y1|. Musisz pamiętać żeby wyznaczyć wartość bezwzględną, bo możesz dostać ujemne wyniki. Jak to zrobisz, to dostaniesz w pewnym sensie długości boków trójkąta, którego przeciwprostokątna to szukana droga. Mam nadzieje, że wiesz jak się liczy długość przeciwprostokątnej, mając dane a i b (IMG:style_emoticons/default/wink.gif)
A jak już wyliczysz drogę, to możesz ją po prostu podstawić do .animate() zamiast tego '2000'. Z tym że jeśli to zrobisz to animacja będzie bardzo szybka więc będziesz musiał dostosować tą prędkość do swoich potrzeb, np. przemnożyć drogę przez 5 i dopiero wtedy podstawić wynik do .animate().

To jedyne co mi przychodzi do głowy o tej porze (IMG:style_emoticons/default/wink.gif)