Вероятно, вы знаете, что transition определяется в CSS следующим образом:
.example {
transition: background-color .5s ease-out;
}
Или может быть использовали длинную форму записи:
.example {
transition-property: background-color;
transition-duration: .5s;
transition-timing-function: ease-out;
}
В обоих случаях мы явного определяли три из четырех параметров, связанных с transition (кроме transition-delay).
Можно ли использовать transition с меньшим количество кода? Конечно! Ниже приведен минимальный код для transition:
.example {
transition: 4s;
}
В этом сокращении единственное, что определяется — это время.
Результат можно посмотреть здесь: демонстрация codepen
Спасибо за внимание!
Подписывайтесь на рассылку! 😉
