View video tutorial

HTML popover Attribute

HTML

The HTML popover attribute is used to define an element as a popover element.

Definition and Usage


➔ When the popover element is invoked, it will be placed on top of other HTML elements.

➔ A popover element will remain invisible until it is invoked by another element (i.e., a <button> or <input type="button">).

➔ Clicking on the invoking/control element will toggle the popover element between showing and hiding.

Example
<!DOCTYPE html>
<html>
<head>
    <title>HTML popover attribute Example</title>
</head>
<body>
    <h3>HTML popover attribute Example</h3>
    <p>Click the button to toggle between show and hide popever element.</p>
    <h1 popover id="sample">This is a popover element.</h1>
    <button popovertarget="sample">Click</button>
</body>
</html>

Applies to

This attribute can be used on the following element.

Attribute Element
placeholder <input>, <textarea>