Анимационное изображение / 3D / спрайт с javascript / css3 / canvas - PullRequest
0 голосов
/ 25 августа 2010

Вид дилеммы здесь. Я делаю мобильную версию веб-сайта, которая имеет некоторые интерактивные вещи, более конкретно, у меня есть этот объект в 3D, который вы можете вращать, я использовал papervision во Flash, но теперь мне нужно сделать это по-другому, так как в мобильном телефоне нет вспышки и Я чувствую, что нахожусь на тонком льду.

Я думал об экспорте вращения на 360 градусов при 30 кадрах в секунду, используя последовательность PNG с альфа-каналом, а затем просто соединяя их вместе в спрайт, затем используя это в качестве фона в CSS и используя background-position для затем «имитации». «Анимация.

Это или просто переключить исходное изображение очень быстро, или каким-то образом, используя "canvas", может, дело в том, что я не уверен, что это даст совершенно низкую производительность? Я имею в виду переключение фоновой позиции или исходного файла изображения с частотой 30 кадров в секунду, это вообще возможно? Будет ли это гладко, или это просто что-то, что пока невозможно сделать? Имейте в виду, что это всего лишь один трехмерный объект, который должен вращаться на основе пользовательского ввода, а не любые другие интерактивные элементы.

Так что, спрайт - это способ togo или canvas или что-то классное, о чем я даже не слышал? Спасибо всем заранее!

1 Ответ

0 голосов
/ 25 августа 2010

Если бы я делал мобильную версию веб-сайта, я бы лишил ее большей части графики и определенно всех анимационных картинок, флеш-памяти и т. Д. - люди, использующие мобильные телефоны для просмотра веб-страниц, обычно не после мультимедийные возможности - им просто нужно быстро получить некоторую информацию и использовать неоптимальное устройство с низкой пропускной способностью и еще худшими дисплеем и производительностью для ее получения. Не усложняйте их.

С другой стороны, я обнаружил, что использование фонового изображения со всеми кадрами анимации и манипулирование background-position из javascript - это прекрасный способ создания небольших анимированных спрайтов, например, для простой игры на javascript для мобильные телефоны:)

...