| top-left | top | top-right |
| left-top | right-top | |
| left | right | |
| left-bottom | right-bottom | |
| bottom-left | bottom | bottom-right |
| trigger | Description |
|---|---|
| click | data-trigger="click"It attaches the click event to the target and toggles the visibility of tooltip on clicking the target element. It also hides the tooltip when user clicks anywhere on rest of the web page. |
| hover | daat-trigger="hover"It is the default behavior that shows/hides the tooltip on mouse over and mouse out event. |
| hoverable | data-trigger="hoverable"It allows to show the tooltip on mouse over event of target element. The tooltip remains in visible state until the user moves the mouse pointer over and then out of the hoverable tooltip balloon. |
data-trigger="focus" It attaches the focus/blur event to target form input elements. The tooltip appears when focus event of the input contol fires and hides on blur. |