popover

The popover global attribute is an emumerated attribute that turns an element into a popover.

It can be used on any HTML element that makes sense as a popover.

# Values

The attribute can have any of the following values:

auto (default value)

The popover exhibits the standard behavior explained at The Popover API: concepts and usage.

manual

Manual popovers cannot be light dismissed, they can only be dismissed by an explicit trigger element (created for example using popovertoggletarget) or by JavaScript (using hidePopOver()), and they don't automatically dismiss previously-shown popovers.

# Example

<p id="my-popover" popover>Hello!</p>
<p id="my-popover" popover="auto">Hello!</p>
<p id="my-popover" popover="manual">Hello!</p>

# Browser compatibility

• The Popover API is planned for launch in Chrome 110, available in stable in early February 2023 (check the Chrome Roadmap for updates).
• It is enabled by default in Chrome Canary for local testing.
• Register for the Origin Trial if you want to test it in a production environment. Read Getting started with Chrome's origin trials for more information.
• There is a polyfill available at https://github.com/oddbird/popup-polyfill.

# See also

• The Popover API
• Pop-ups: They're making a resurgence!, by Jhey Tompkins
• Chrome Platform Status: The Popover API
• Open UI: Popover API Explainer