Анімація в CSS-2. Приклади анімацій кнопок
Цей пост продовження поста про анімації через transition. Хочу додати кілька прикладів, які я використовую для анімації кнопок по наведенню.
Приклад 1. Плавна зміна коліру.
See the Pen animation background for hover by molodezky (@molodezky) on CodePen.0
Приклад 2. Плавне горизонтальне заповнення.
В цій та наступних ми використовуюмо псевдоелемент :before. Для того, щоб він не перекривав текст кнопки, цей текст ми огортаємо в span.
See the Pen animation background for hover by molodezky (@molodezky) on CodePen.0
Приклад 3. Плавне вертикальне заповнення.
See the Pen animation background for hover by molodezky (@molodezky) on CodePen.0
Приклад 4. Блік.
See the Pen animation background for hover by molodezky (@molodezky) on CodePen.0
Немає коментарів.