ToolTip

ToolTip

Basic Tooltips

Hover over the buttons below to see the four tooltips directions: top, right, bottom, and left.

Basic Tooltips color button

Hover over the buttons below to see the four tooltips directions: top, right, bottom, and left.

Tooltips Trigger

Tooltip 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="click" for click trigger.

Use data-trigger="focus" for focus trigger.

Use data-trigger="hover" for hover trigger.

Use data-trigger="manual" for manual trigger.

Tooltip Options

Options can be passed via data attributes or JavaScript. For data attributes, append the option name to data-, as in data-animation="".

Use data-animation="true" for animation.

Use data-animation="false" for no animation.

Use data-delay="1000" for 1000ms delay.

Use data-html="true" for html .