To do this with the (upcoming) interest invoker API, it's 1 line of code:
.parent:has(:interest-source) button {
interest-show-delay: 0s;
}
You have your default delay. Then, you update the interest delay when an element inside of the parent has interest (i.e. hover).
Tooltips tip:
Tooltips should have a delay before appearing to prevent accidental activation. Once a tooltip is open, hovering over other tooltips should open them with no delay and no animation.
This feels faster without defeating the purpose of the initial delay.
Sep 15, 2025 · 6:58 PM UTC
8
49
958
93,624
Demo link (Canary 142+): codepen.io/una/pen/LEpwLdN
1
15
3,063
