Отключить эффекты перехода на пари ⇐ CSS

[Anonymous]

Можно ли отключить эффекты перехода для события: Hover ?
См. Фрагмент: Нажатие кнопки показывает некоторые div s один за другим с выцветающим феном (с помощью преобразования). Тем не менее, вытухание также происходит при падении div s, в то время как я предпочитаю «нормальный»: hover эффект.
Примечание. Преобразование использует только сестрент-count () и сестры-индекс () , которые доступны только в брейдезаторах хрома. class = "Snippet">

Код: Выделить всё

let container = document.querySelector(".container"),
opener = document.querySelector("#opener");
opener.addEventListener("click", () => {
container.classList.toggle("show");
});< /code>
:root {
--wait: calc(sibling-index() * .1s);
}

.divs div {
display: inline-block;
visibility: hidden;
cursor: pointer;
width: 28px;
height: 28px;
margin-right: 3px;
border:1px solid #999;
border-radius: 4px;
font-size: 14px;
text-align: center;
background-color: #ddd;
line-height: 28px;

&:hover {
background-color: #ada !important;
transition: none !important;
}

.show & {
visibility: visible;
background-color: transparent;
transition:
0s all steps(sibling-count(), end) var(--wait),
1.5s background-color ease-out var(--wait);
/*
&:hover {
background-color: #ada !important;
transition: none !important;
}
*/
}
}< /code>
show / hide


A
B
C
D
E
F
G
H

Подробнее здесь: https://stackoverflow.com/questions/797 ... over-event