Поддержка сайта

Высокие позиции в поисковой системе, на прямую зависят от развития вашего сайта.

Продвижение сайтов

Эффективность стратегий продвижения подтверждается сотрудничеством с крупными клиентами и отзывами о нашей работе.

Создание сайтов

Мы делаем сайты быстро, недорого и профессионально. От работы с нами, у вас останутся только положительные эмоции.

Множественные переходы

.

Множественные переходы

Свойство transition допускает вызов нескольких переходов сразу. Например, если мы хотим одновременно изменить цвет, угол поворота и размер, мы можем это сделать.

Скажем, мы хотим не просто сделать переход от одного угла наклона текста к другому, но и изменить свойство color текста.

Для начала мы должны указать, с какими свойствами мы намерены осуществлять переходы, и либо включить в этот список color, либо использовать ключевое слово all:

transition-property:  transform,  color; transition-duration:   0.2s; transition-timing-function:  ease-out;

Вы также можете указать специфические параметры для каждого свойства, участвующего в анимации. Просто укажите их через запятую, сохраняя порядок, указанный в свойстве transition-property: transition-property:  transform,   color; transition-duration:  0.2s,   0.1s; transition-timing-function:  ease-out,   linear;

Согласно этой записи, будет создан замедляющийся к концу переход продолжительностью 0,2 секунды для функции transform, и переход с постоянной скоростью продолжительностью 0,1 секунды для свойства color.

При использовании краткой формы записи тоже можно использовать множественные переходы. В этом случае укажите все значения для каждого перехода и разделите их запятыми:

Множественные переходы

Если вы захотите, оба свойства могут иметь одинаковую скорость перехода и задержку. Включите два имени свойств или, если все переходы должны происходить в одинаковом темпе, ключевое слово all:

Множественные переходы

Если вам не нужно, чтобы все переходы происходили с одинаковой скоростью, или если вы просто хотите выбрать несколько свойств, к которым будет применен эффект перехода, сделайте список, разделенный запятыми, где в качестве аргумента для каждого значения будут указаны как минимум transition-property и transition-duration.


.

Читайте так же:
Not found