Несколько типов переходов css3, не использующих 'all'

Question

Я пытаюсь изменить масштаб и непрозрачность с помощью переходов CSS3 - я не могу понять, как выполнить переход нескольких объектов без использования all

transition-function: all;
transition-duration: 1s;
transition-timing-function: ease-in;

,как:

transition: all 1s ease-in;

и

transition-function: opacity;

или

transition-function: scale;

, но не

transition-function: scale, opacity;

См. пример здесь: http://jsfiddle.net/5PCGs/7/

Любая помощь будет очень признательна!Спасибо :)!

Редактировать:

Я решил, что это transition-property (спасибо Симоне), но теперь в Firefox есть только прозрачность анимации, а не оба - http://jsfiddle.net/5PCGs/9 - сравните это в FF и Chrome бок о бок

Answer 1

Благодаря Борису Збарскому и Симоне Виттори .

Ответом было использование transition-property, а не указывать все, что вы там преобразуетеПросто укажите transform в качестве одного из значений и позвольте различиям в преобразованиях между классами позаботиться о себе.

transition-property: transform,opacity;
transition-duration: 1s;
transition-timing-function: ease-in;

РЕДАКТИРОВАТЬ: Не для получениядобавить любые префиксы, которые вам нужны.Например, для браузеров Webkit:

-webkit-transition-property: -webkit-transform,opacity;
-webkit-transition-duration: 1s;
-webkit-transition-timing-function: ease-in;

Еще раз спасибо!

Answer 2

Попробуйте использовать transition-property вместо transition-function, которого на самом деле не существует.:)

Каждое из свойств перехода принимает список через запятую, что позволяет определять несколько переходов.