HTML popover-attributten

Definition og brug

popover Egenskaben definerer elementet som et pop-up-element, hvilket betyder, at når elementet bliver kaldt, vil det blive placeret øverst i indholdet og vil ikke forstyrre placeringen af andre HTML-elementer.

Pop-up-elementet vil være usynligt, før det bliver kaldt af et andet element. Det andet element skal have en popovertarget-attribut, der refererer til pop-up-elementets id.

Pop-up-elementet vil blive placeret øverst over al anden indhold, ved at klikke på popovertarget-elementet kan pop-up-elementet skiftes mellem at være synligt og usynligt:

Hej

Pop-up-elementer kan være enten en enkelt HTML-element som i ovenstående eksempel, eller en hel samling af HTML-elementer som i nedenstående eksempel.

Se også:

HTML reference manual:HTML Input popovertarget-attributten

HTML reference manual:HTML Input popovertargetaction-attributten

Eksempel

Eksempel 1

Tilføj et element med popover-attributten <h1> samt en knap til at vise/skjule det:

<h1 popover id="myheader">Hej</h1>
<button popovertarget="myheader">Klik mig!</button>

亲自试一试

例子 2

将一个 div 元素用作弹出元素：

<div popover id="mydiv">
  <h2>Popover</h2>
  <hr>
  <p>弹出窗口是一个放置在所有其他元素之上的元素。</p>
  <p>当您想要告知一些重要的事情时，可以使用它。</p>
</div>

亲自试一试

语法

<element popover>

属性值

popover 属性是布尔属性。如果已设置它，它指定该元素是弹出窗口元素。

浏览器支持

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
114 114 不支持 17 100