Components

Popovers

Hover over the button to see the popover.

[popover position=”top” url=”#” type=”danger” title=”Popover Title” body=”Popover content”]Hover for popover[/popover]

[popover position=”bottom” url=”#” type=”warning” title=”Popover Title” body=”Popover content”]Popover Bottom[/popover]

[divider type=”dotted”]

Plain Text Popover

This is an example of a plain text [popover position=”top” url=”#” type=”none” title=”Popover Title” body=”Popover content”]popover[/popover]. Rollover theĀ [popover position=”right” url=”#” type=”none” title=”Popover Title” body=”Popover content”]highlighted text[/popover] to see the demo in action.

[divider type=”dotted”]

Tooltip

Rollover the various elements below to see a demo of the tooltip function.

[tooltip position=”top” url=”#” type=”info” title=”Button Tooltip”]Rollover for tooltip[/tooltip]

[tooltip position=”top” url=”#” type=”none” title=”Label Tooltip”][label type=”important”]Label Example[/label][/tooltip]

[tooltip position=”top” url=”#” type=”none” title=”Badge”][badge type=”success”]01[/badge][/tooltip]

[tooltip position=”top” url=”#” type=”none” title=”Icon Example”][icon type=”icon-download” color=”black”] [/tooltip]

[divider type=”dotted”]

Plain Text Tooltip

This is a plain text exmaple of the [tooltip position=”top” url=”#” type=”none” title=”Top Tooltip”]tooltip function[/tooltip]. Rollover the highlighted text to see the [tooltip position=”bottom” url=”#” type=”none” title=”Btm Tooltip”]tooltips[/tooltip].

[divider type=”dotted”]