Моя цель:
- Переместите/анимируйте изображение вдоль пути, как показано на рисунке ниже (возможно, подключение кривых Безье).
- Должен работать в IE7+, а не для того, чтобы создавать несколько решений.
- Я могу приостановить/возобновить движущееся изображение.
- Изображение будет продолжать двигаться по пути (повторите).
Что я рассмотрел
- CANVAS: не поддерживается в IE7+ 8, еще не проверял explorercanvas! Предвидите некоторые проблемы с z-индексами.
- SVG, не поддерживается в IE7+ 8.
- jQuery.path, плагин, расширяющий функцию анимации jQuery. Не могу понять часть резюме, и я хочу использовать CSS-преобразования, когда они поддерживаются.
Мой план
- Анимируйте изображение с помощью CSS 3D-преобразования, CSS 2d-преобразования или jQuery.animate (что поддерживается) и requestAnimationFrame.
- Рассчитайте все координаты и просто переместите изображение попиксельно.
Мой вопрос
- Мой план звучит как безумие? Лучшие предложения?
- Вы предвидите некоторые проблемы с производительностью? Я мог бы в конечном итоге с 5K или 10K координаты.
- Знаете ли вы умный способ, программу, функцию или что-нибудь подобное для вычисления всех координат?