Four options are available: top, right, bottom, and left aligned.
Ice cream tootsie roll tiramisu tootsie roll toffee dragée sugar plum cake. Liquorice jelly jujubes. Powder danish tart apple pie dessert cheesecake tiramisu soufflé bonbon. Carrot cake wafer toffee.
Add .popover-top
class for top popover along with .popover
class.
Ice cream tootsie roll tiramisu tootsie roll toffee dragée sugar plum cake. Liquorice jelly jujubes. Powder danish tart apple pie dessert cheesecake tiramisu soufflé bonbon. Carrot cake wafer toffee.
Add .popover-right
class for right popover along with .popover
class.
Ice cream tootsie roll tiramisu tootsie roll toffee dragée sugar plum cake. Liquorice jelly jujubes. Powder danish tart apple pie dessert cheesecake tiramisu soufflé bonbon. Carrot cake wafer toffee.
Add .popover-bottom
class for bottom popover along with .popover
class.
Ice cream tootsie roll tiramisu tootsie roll toffee dragée sugar plum cake. Liquorice jelly jujubes. Powder danish tart apple pie dessert cheesecake tiramisu soufflé bonbon. Carrot cake wafer toffee.
Add .popover-left
class for left popover along with .popover
class.
Four options are available: top, right, bottom, and left aligned.
Add data-toggle="popover"
& data-placement="top"
to add top popover.
Add data-toggle="popover"
& data-placement="right"
to add right popover.
Add data-toggle="popover"
& data-placement="bottom"
to add bottom popover.
Add data-toggle="popover"
& data-placement="left"
to add left popover.
This event fires immediately when the show
instance method is called.
This event is fired when the popover has been made visible to the user (will wait for CSS transitions to complete).
This event is fired immediately when the hide
instance method has been called.
This event is fired when the popover has finished being hidden from the user (will wait for CSS transitions to complete).
This is considered a “manual” triggering of the popover.Popovers whose both title and content are zero-length are never displayed.
Reveals an element’s popover. Returns to the caller before the popover has actually been shown.(i.e. before the shown.bs.popover
event occurs)
Hides an element’s popover. Returns to the caller before the popover has actually been hidden (i.e. before the hidden.bs.popover
event occurs).
Toggles an element’s popover. Returns to the caller before the popover has actually been shown or hidden (i.e. before the shown.bs.popover
or hidden.bs.popover
event occurs).
Hides and destroys an element’s popover. Popovers that use delegation cannot be individually destroyed on descendant trigger elements.
Popover is triggered using - click | hover | focus | manual options. You may pass multiple triggers; separate them with a space. "manual" cannot be combined with any other trigger.
Use data-trigger="hover"
for hover trigger.
Use data-trigger="click"
for click trigger. This is a default trigger.
Use data-trigger="focus"
for focus trigger.
Use data-trigger="manual"
for manual trigger. You can do show/hide using js
Use data-animation="false"
to remove fade animation. Default is true.
Delay showing and hiding the popover (ms
) - does not apply to manual trigger type.
Use data-html="true"
for HTML supported trigger.
Base HTML to use when creating the popover. The popover's title will be injected into the .popover-inner
. .arrow
will become the popover's arrow.The outermost wrapper element should have the .popover
class.