HTML <button> popovertargetaction Attribute
Example
Create two buttons: one for "Show" popover, and one for "Hide" popover:
<button popovertarget="tip1" popovertargetaction="show">Show</button>
<button popovertarget="tip1" popovertargetaction="hide">Hide</button>
<div id="tip1" popover>
Here we can show a helpful tip.
</div>
Try it Yourself »
Definition and Usage
The popovertargetaction attribute
defines what happens to the targeted popover element when you click the button.
Legal values are: "show", "hide", and "toggle".
If the popovertargetaction attribute is not specified, the default "toggle" value is used.
Syntax
<button popovertarget="element_id popovertargetaction="hide|show|toggle"">
Attribute Values
| Value | Description | |
|---|---|---|
| hide | Hides the popover element when button is clicked | Try it » |
| show | Shows the popover element when button is clicked | Try it » |
| toggle | Default value. The popover element is toggled between hidding and showing when the button is clicked | Try it » |
Browser Support
| Attribute | |||||
|---|---|---|---|---|---|
| popovertargetaction | 114 | 114 | 125 | 17 | 100 |
Related Pages
HTML global attributes: popover
HTML <button> attribute: popovertarget
HTML tutorial: Popover API
