Jquery — отрывистая анимация

#jquery #animation #timer

#jquery #Анимация #таймер

Вопрос:

У меня есть небольшая анимация, которая работает немного отрывисто во всех браузерах. Я что-то делаю не так?

Вот мой код: http://jsfiddle.net/iltdev/nN6cT/2 /

Ответ №1:

Одна вещь, которую вы делаете неправильно, заключается в том, что вы запускаете новые анимации до завершения предыдущих для элемента..

Это происходит потому, что вы используете плагин синхронизации и запускаете новую анимацию с фиксированными интервалами. Лучше использовать аргумент обратного .animation() вызова метода и запускать новую анимацию после завершения предыдущей..

демонстрация на http://jsfiddle.net/gaby/qaGyS/2 /


Другое дело, что вы анимируете очень маленькое расстояние в течение длительного времени (для этого расстояния). Например, вы анимируете 10 пикселей в секунду .. это медленно, и вы можете видеть отдельные движения..

с более быстрой анимацией на http://jsfiddle.net/gaby/qaGyS/1 /

Комментарии:

1. Спасибо, Габи. Это определенно сгладило ситуацию для меня. Я думаю, что мой компьютер частично виноват, поскольку я попробовал пару компьютеров коллеги, и он снова стал немного более плавным. Идея анимации состоит в том, чтобы в конечном итоге заставить людей подпрыгивать вверх и вниз на воздушных шарах, отсюда и небольшое количество движений в течение длительного периода времени. Еще раз спасибо за помощь 🙂

Ответ №2:

Рассмотрите возможность использования смягчения для ваших анимаций. Например: http://matthewlein.com/experiments/easing.html

Комментарии:

1. Я думал, что ослабление просто изменило время, например, чтобы дать эффект замедления? На моем компьютере вся анимация, кажется, «застревает» на секунду или две, затем снова начинает двигаться… как будто компьютер изо всех сил старается не отставать.