3

## 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 .

Search results
Headphone 1

Gadget

$300 $400

Sale

Headphone 1

Gadget

$300 $400

New

Headphone 1

Gadget

$300 $400

New

Headphone 1

Gadget

$300 $400

New