Tooltips need a delay, and then they need to skip it

138 points - yesterday at 4:35 PM

Source

Comments

ProxCoques yesterday at 9:30 PM
It will never cease to amaze to me that Apple (under Jef Raskin who also wrote about this in The Humane Interface) observed and fixed problems with interactions like this in SYSTEM 6 in like 1993 or something - only for the same problem to have to be re-descovered and re-fixed decades later.
brixie yesterday at 8:18 PM
This looks it's describing the same technique as the last example in https://emilkowal.ski/ui/you-dont-need-animations (and that whole post is worth a read, I think, if you found this interesting).

It's such a small detail that I wouldn't have otherwise noticed (because I don't build animations, so it doesn't cross my mind), but now that I know about it, I think about it all the time.

hurrell yesterday at 6:54 PM
I think I would describe this as an example of hysteresis. Neat! https://en.wikipedia.org/wiki/Hysteresis
compiler-guy yesterday at 5:35 PM
I greatly appreciate this attention to detail, and there isn't enough of this in the world. For example, in Visual Studio popups on hover happen so fast you can barely select anything, or you end up clicking on the popup instead of selecting a word.
phyzome yesterday at 5:34 PM
I ran into the same problem about 20 years ago when implementing hover-based dropdown menus on a website. It was only about 10 lines of JS and a couple global variables but I was the only person who understood it. :-P

(These days I would have included more comments.)

Naturally, there was a fallback to pure CSS menus, because we weren't barbarians.

nayroclade yesterday at 5:44 PM
Chris Coyier also posted a version using only HTML/CSS, no JS: https://blog.master.dev/delayed-then-instant-tooltips-with-h...
kazinator today at 2:55 AM
Basically, have a global temperature. When the pointer is in something that has a tooltip, the temperature rises. Otherwise it cools (possibly at a different rate). A tooltip is shown only when the pointer is in bounds, and the temperature is above a certain threshold.
goda90 yesterday at 8:03 PM
What about using mouse velocity? If the mouse is changing position at a certain rate, don't show the tooltips.
Prydown today at 2:40 AM
Windows taskbar has done this forever and I never once noticed it consciously. Good catch.
jameshart yesterday at 11:04 PM
Feels like the delay also gets implemented into displaying the tooltip on tap on a touch interface which is probably an error.
zx8080 today at 2:07 AM
Is this post text claude-generated? Very creepy to read around the solution section. It reads like the agent report.
halostatue yesterday at 5:44 PM
The pure CSS version seems more interesting to me: https://blog.master.dev/delayed-then-instant-tooltips-with-h...
cush today at 4:06 AM
I was disappointed to see the new web popover api doesn't have this basic usability feature built in
self_awareness yesterday at 8:57 PM
Hilarious. Web devs discovering UX from Win95. What's next, 3d buttons?
jay_kyburz yesterday at 8:12 PM
Perhaps I'm just an old grump, but I prefer the No Delay version in the example.

I like predictable, consistent, and fast.

jobuildsstuff today at 2:24 AM
[flagged]