Стоит ли полагаться на CSS3 для анимации или использовать JavaScript для броузеров не-WebKit?

Question

Я работаю над сайтом, на котором я все еще на стадии разработки. Это будет действительно круто с некоторыми хорошими простыми анимациями преобразования.

Но теперь я не уверен, должен ли я использовать новейшие технологии (CSS3 / HTML5), чтобы делать свои анимации, чтобы они хорошо воспроизводились в браузерах webkit и создавать запасной сайт для не-webkit. Который, вероятно, не займет много моего времени и получится довольно гладко.

Или, в качестве альтернативы, я мог бы попытаться подделать анимацию с помощью JS, что займет у меня больше времени, чтобы разобраться, и не будет выглядеть так красиво и гладко. Также на данный момент нет реальных простых / привлекательных решений. Transform3d от Heygrady приближается, но мне не хватает нескольких необходимых мне функций, и из-за моего ограниченного навыка JS я не могу погрузиться в него и построить его сам.

Answer 1

На мой взгляд, используйте HTML5 / CSS3 для анимации.Пока это не влияет на основные функциональные возможности (например, посетители без поддержки могут все еще перемещаться / читать / отправлять формы / и т. Д.), Тогда оставьте приятные вещи для тех браузеров, которые поддерживают это.

Анимация Javascript может быть плавной иВыглядит очень хорошо, но, как вы сказали, писать будет дольше и поддерживать будет сложнее.

Если я изменю дизайн существующего веб-сайта, я проверю журналы Analytics / server, чтобы увидеть, какие браузеры наиболее популярны.для целевой аудитории.Если 90% из них будут на IE7, то я соответствующим образом кодирую сайт!

Надеюсь, это поможет

Answer 2

Я думаю, это зависит от целевой аудитории.

Используйте CSS в следующих случаях:

• Для устройств iOS, поскольку CSS-переход аппаратно ускоряется
• Требуется 3D-преобразование, потому что вы можете сделать это только с помощью CSS

Используйте JavaScript в следующих случаях:

• Вам необходим точный контроль частоты кадров или точного положения движущихся объектов, потому что вы не можете сделать это с помощью CSS

Answer 3

В зависимости от того, что вы хотите делать с анимацией, jQuery может помочь вам сделать это проще и с разумной производительностью.

• http://api.jquery.com/category/effects/