Есть набор картинок.
Пример:
1) человек в стоящем положении (базовое)
2) человек поднимает руку (кадр из процесса)
3) человек с поднятой рукой
4) человек поднимает ногу (кадр из процесса)
5) человек с поднятой ногой
Цель такая:
Вызывается функция JavaScript и происходит анимация.
Какие варианты у меня:
1) html canvas
2) сделать по слоям и transform: scale(0); transform: scale(1);
3) использовать GIF
Какой вариант наиболее кроссбраузерный и оптимальный?
Алексей Лебедев: Согласен, от балды написал как раз я ибо невнимательно прочёл вопрос. Прошу прощения.
А что ты понимаешь под кроссбраузерностью? Очевидно же, что самый кроссбраузерный - gif, он аж в ИЕ 5.5 заработает. Единственный недостаток - нельзя управлять скоростью анимации.
GreatRash: согласен, но его проблематично запускать и останавливать.
Поэтому его оставим как крайний случай, для отстойных браузеров.
В общем, если в IE или в моб браузерах, не будет работать, это не критично. Но я должен знать в каких.
А вот, Chrome, Safari, FF, Opera тут обязательно хорошо и четко.
Алексей Лебедев: Можно сделать CSS-анимацию, для мобил понадобятся префиксы (-webkit), работает начиная с ИЕ10. Из минусов: нельзя остановить на определённом кадре.
Можно зафигачить канвас. Будет работать начиная с ИЕ9. Из минусов: придётся тянуть библиотеку для работы с API канваса, ну или писать самому кучу кода.
Я бы например сам написал скриптик покадровой анимации например бекграунда (как в примере про CSS). Или вот например готовый скриптик. Минусов не вижу. Из плюсов: будет везде работать и заодно можно анимировать хоть жипег.