demo · v133
Avatar hovercard — the Twitter / GitHub use case
Four user avatars. Hover, focus, or long-press any one and the matching profile hovercard appears. No JS, no :hover + display hack, no library. The interestfor attribute on each avatar binds it to a popover and the platform decides what counts as "interest".
interestfor is not supported here. The popovers will not open on hover. Click the avatar manually to confirm the popovers themselves work. Needs Chrome 133+ behind chrome://flags/#html-invokers.Rumi Tanaka
Lead designer on the new mDL onboarding flow. Photography on weekends.
Orla O'Sullivan
Worked on the original popover invoker spec. Knits in meetings.
Kai Sato
Spec author on Selectors Level 4. Cycles to work in winter.
Sora Levine
Co-led the Fluent scrollbars work. Avid bird-watcher.
what counts as "interest"
The spec leaves the gesture to the user agent. Today the implementation triggers interest on hover (with a small delay to avoid flicker), on keyboard focus, and on touch long-press. That's exactly the set of behaviours every hovercard library has hand-implemented for fifteen years, with bugs around focus management, race conditions on quick mouse-outs, and missing keyboard accessibility. interestfor moves that into the platform.
<a href="/user/rumi" interestfor="pop-rumi">@rumi</a>
<div id="pop-rumi" popover>…profile card…</div>