Переопределить длительность перехода при наведении:
.mySpan {
opacity: 0.1;
font-size: 12px;
background: red;
border-radius: 5px;
color:#fff;
transition: opacity cubic-bezier(0, 0.52, 1, 1) 1s;
}
.mySpan:hover{
opacity: 1;
transition-duration: 200ms;
}
<span class="mySpan">Hello</span>
При наведении курсора он отображается быстро, длительность которого составляет 200ms
, но при прекращении зависания возвращается к 1s
и медленно скрывается.