popover HTML атрибут - спливаюче вікно

Глобальний атрибут popover дозволяє будь-якому елементу відображатися як спливаюче вікно, розміщуючи його поверх іншого вмісту сторінки при відображенні.

Атрибут popover має три стани: auto, manual та hint. Стан auto забезпечує функціональність "легкого закриття" (light dismiss), закриваючи спливаюче вікно при кліку за його межами, тоді як спливаючі вікна manual не закриваються таким чином. Атрибут popovertarget на кнопках може використовуватися для керування видимістю елемента спливаючого вікна, а popovertargetaction вказує, чи потрібно show (показати), hide (приховати) або toggle (перемкнути) спливаюче вікно. Елементи з атрибутом popover також мають методи showPopover(), hidePopover() та togglePopover() для програмного керування.

<div id="my-popover" popover>...</div>

<button popovertarget="my-popover">Відкрити спливаюче вікно</button>

<div id="my-popover" popover>
  <p>Це спливаюче вікно!</p>
  <button onclick="document.getElementById('my-popover').hidePopover()">Закрити</button>
</div><br><br>

<button popovertarget="manual-popover" popovertargetaction="toggle">Перемкнути ручне спливаюче вікно</button>
<div id="manual-popover" popover="manual">
  <p>Це ручне спливаюче вікно. Воно не закриється при кліку за межами.</p>
</div>

#manual-popover {
  border: 1px solid #ccc;
  padding: 10px;
  display: none;
}