CSS3 анимациите ви позволяват да анимирате прехода между един CSS стил и друг. Те се състоят от два компонента: стилът, който описва анимацията, и наборът от кадри, които показват нейното начално и крайно състояние.
CSS анимациите имат някои предимства , като например, че са сравнително лесни за създаване в сравнение с традиционните техники за писане на скриптове. Следователно, ако използвате добри, висококачествени източници на ресурси, работата ще бъде още по-лесна. Това обаче отнема време и може да бъде доста трудно, така че тези източници на ресурси могат да бъдат много полезни.
Функция за облекчаване
Тази функция определя скоростта на анимацията , за да я направи по-реалистична. Чекмеджето се отваря, ускорява и след това забавя. Когато нещо падне, то първо пада бързо и след това отскача обратно. Можете да намерите желаната функция на тази страница на easing.net. Най-хубавото е, че е на нашия език, което ви улеснява в навигирането в този уебсайт.
Animate.css
Дан Идън е съставил красиво изработена библиотека от CSS анимации , които можете да използвате в проектите си. Самият проект е чудесен източник на вдъхновение.
Animate Plus
Stripe е добре познат със своите висококачествени продуктови страници и анимации към тях. Един от креативните умове зад тези анимации е Бенджамин Де Кок, който е създал лека, но високопроизводителна CSS и SVG библиотека за анимации, идеална за мобилни устройства.
Hover.css
Подобно на Animate.css, Hover.css е колекция от безплатни CSS ефекти, които можете да използвате както пожелаете в проектите си. Той се фокусира върху ефекти при задържане на курсора върху връзки, бутони, изображения и други.