Как сделать обратный transition цвета в CSS?
238
26 апреля 2022, 22:10
Недавно начал верстку сайта. Я задал transition почти каждому элементу на сайте - работает все красиво и слажено. Так вот сейчас стоит задача: сделать обратный transition, то есть задержку при отведении курсора. Подскажите как это можно реализовать, и какой вообще для этого существует псевдокласс в CSS?
Answer 1
Просто добавляете свойство transition не только на hover
span {
transition: color .5s;
}
span:hover {
transition: color .5s;
color: red;
}<span>Text</span>Answer 2
transition-delay для задержки. ease-in-out для обратной анимации
button {
border: 0px;
border-radius: 2px;
outline: none;
padding: 4px 8px;
cursor: pointer;
color: #FFF;
background: #63AEEE;
cursor: pointer;
transition: .5s ease-in-out;
transition-delay: .5s;
}
button:hover {
background: #FF6040;
}<button>qeqqe</button>
-
22:40
-
08:34
-
15:01
-
17:01
-
11:24
-
10:16
-
17:54
-
22:01
-
13:03
ТОП-10
- Почему SERVER_ADDR имеет не тот IP 47663 visits
- Как заменить $_SERVER[REMOTE_ADDR] на IP клиента в PHP за двумя Nginx? 30533 visits
- Хочу вывести несколько строк из массива в один div, выводит только много undefined; подскажите, что делать? 23691 visits
- Как через css изменить цвет png изображения? 10363 visits
- Blob video url download 9972 visits
- Php curl запрос через прокси с авторизацией 9226 visits
- Работа с captcha vk api 8108 visits
© "hostciti.net" 26.12.2024 | 05:02