Функция плавности (easing) определяет скорость течения анимации, делая её более реалистичной.
Реальные вещи не начинают двигаться мгновенно и с постоянной скоростью. Открывая ящик стола, мы в начале ускоряем его, а затем тормозим. При падении мячик постоянно ускоряется, а после удара об пол — слегка подпрыгивает.
Этот сайт поможет подобрать нужную функцию плавности.
.block { transition: transform 0.6s ; }
@keyframes
:.block { transition: transform 0.6s ; }
@keyframes
, смотри выше..block { background: linear-gradient( to bottom, #1473e6, , #247b5e ); }
function (x: number): number {
}
function (x: number): number {
}