Popover

Seriously almost every “menu” and “tooltip” could and should use this when it’s ready.

They are pretty similar in both look and functionality, but are have some important differences, slightly different APIs, and functionality. The use cases are also a bit different, so let’s have a look!

Now that we’re starting to see better support for @starting-style and the allow-discrete keyword, we’ve got a pretty straightforward way for defining *different* entry and exit states.

I’m first hearing about the CloseWatcher API after running across Abdelrahman Awad’s blog post about it. The MDN docs are quite direct, making the purpose clear: Some UI components have “close behavior”, meaning that the component appears, and the user can close it when they are finished with it. For example: sidebars, popups, dialogs, or […]

Michelle Barker’s technique for popover footnotes is great. Here we look at ways we could fight the content duplication. There are ups and downs.

The State of HTML 2023 Results are out! I thought this survey was more interesting to take than reading these results. It’s not that the results aren’t interesting. I’m almost impressed by how low the “used it” percentages are for certain features, like less than half of people have used a <details>?? And 28% are […]

We can *mostly* use HTML alone for this API. But here, we’ll use CSS to style the “links” within paragraphs and a JS library to position them, in lieu of CSS anchoring.

This API, which you can use entirely in HTML, allows you to open an element on top of *everything* despite where it lives in the DOM and without any particular styling.

Dropdowns, menus, tooltips, comboboxes, toasts — the popover attribute will make building a large variety of UI components easier. The popover attribute can be used on any HTML element, so you have the flexibility to choose whichever element is most appropriate semantically for each particular use case. Unlike a dialog, a popover is always non-modal […]