Закрыть   X

  •    
  •    
Печать

animation-timing-function

Автор: Алексей Елизаров.

CSS свойство animation-timing-function

Поддержка браузеров

 

Описание

Свойство animation-timing-function определяет кривую скорости для анимации.

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

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

Значение по умолчанию: ease
Наследуется: нет
Версия: CSS3
Синтаксис JavaScript: object.style.animationTimingFunction="linear"


Значения свойства

Значение Описание
linear Анимация проигрывается с одинаковой скоростью от начала до конца.
ease Анимация ускоряется к середине и замедляется к концу проигрывания.
ease-in Замедленная анимация на старте.
ease-out Анимация замедляется к концу.
ease-in-out Анимация замедленна вначале и в конце.
cubic-bezier(n,n,n,n) Определение ваших собственных значений в кубической функции Безье. Возможные числовые значение 0 и 1.

div#myDIV
{
animation-timing-function:linear;
}


© 2018 cssprofi.ru.Алексей Елизаров. Все права защищены
cssprofi.ru - запрещено использование материалов сайта без согласия его автора и обратной ссылки