Задать вопрос
OlegTar
@OlegTar
программист .NET, Javascript, Perl

Как сделать плавное перемещение?

Как сделать плавное перемещение объекта? Вариант jQuery взять не могу, мне не для javascript'а надо.

Вот как здесь, например,: otvety.google.ru/otvety/, в блоке «Популярные темы».


Я смотрел код jQuery, ничего там не нашёл, там не так всё открыто.


Мои попытки:


Сначала я решил потренироваться на Javascript'е: подвигать плавно div

Сначала сделал такой вариант:

d = расстояние

t — время, за которое надо пройти расстояние d, в секундах

t1 — начальное время


Вот вырезка из кода:
t1 = new Date();
setTimeout(move);

function move() {
  var t2 = new Date();
  if ((t2 - t1)/1000 > t) {
    div.style.left = d + 'px';
  }
  else {
    div.style.left = ((t2 - t1) / (1000 * t)) * d + 'px';
    setTimeout(move, 50);
  }
}



Но это не то, не так плавно как в Ответах Гугла.

Потом пробовал добавить ускорение:

var a = 1.5;//во сколько увеличивать скорость
var at = 1;//через какое время увеличивать скорость в a раз (a / at — это ускорение)
...
function move() {
  ...
  else {
  var t0 = (t2 - t1) / (1000 * t);
  div.style.left = (t + t * a/at) * d + 'px'
  setTimeout(move, 50);
  }
  ...
}



Тоже не получилось.

Подскажите, если знаете.
  • Вопрос задан
  • 20589 просмотров
Подписаться 9 Оценить Комментировать
Ответ пользователя B@rmaley.e><e К ответам на вопрос (3)
barmaley_exe
@barmaley_exe
Про анимацию на JS можно почитать тут.
Ответ написан