popover
该popover全局属性用于将元素指定为弹出窗口元素。
弹出窗口元素通过display: none隐藏,直到通过调用/控制元素(即具有popovertarget属性的<button>或<input type="button">)或HTMLElement.showPopover()调用打开。
弹出元素打开时,将显示在所有其他元素之上的顶层,并且不会受到父元素的position或overflow样式的影响。
弹出属性可以具有值"auto"(默认值)或"manual"。具有auto状态的弹出窗口可以通过选择弹出窗口区域外部进行“轻触关闭”,并且通常一次只能显示一个弹出窗口。相比之下,manual弹出窗口必须始终显式隐藏,但允许使用嵌套菜单中的弹出窗口等用例。
有关用法的详细信息,请参阅Popover API首页。
示例
以下呈现一个按钮,激活时将打开一个弹出元素。
html
<button popovertarget="my-popover">Open Popover</button>
<div popover id="my-popover">Greetings, one and all!</div>
注意:请参阅我们的Popover API 示例首页以访问 MDN 弹出示例的完整集合。
规范
| 规范 |
|---|
| HTML 标准 # the-popover-attribute |
浏览器兼容性
BCD 表格仅在浏览器中加载
另请参阅
- Popover API
popovertargetHTML 属性popovertargetactionHTML 属性::backdropCSS 伪元素:popover-openCSS 伪类