Popovers are a common web feature and we know it as popups, popovers or overlays. To create a modal we generally use script to trigger open state, closed state, keyboard binding.

To make all that possible without any external script, a declarative HTML API is to be shipped in Chromium 114.

Let's explore how it works with a simple example.

<button popovertarget="enquiry-form"> Open Popover </button>

<div id="enquiry-form" popover>
  <p>This is a simple modal.</p>
</div>

Output

We can do much more with the popover API and customize it further as per our need. To learn more visit -  Using the popover API