Tooltip

A simple text popup tip.

Tooltip will show on mouse enter

Basic
The simplest usage
<p>
    <span data-tooltip="prompt text">Tooltip will show on mouse enter</span>
</p>
L T
C T
R T
L C
R C
L B
C B
R B
Placement
There are 8 placement options available
<div class="SnBtn block" data-tooltip="prompt text" data-position="left top">L T</div>
<div class="SnBtn block" data-tooltip="prompt text" data-position="center top">C T</div>
<div class="SnBtn block" data-tooltip="prompt text" data-position="right top">R T</div>
<div class="SnBtn block" data-tooltip="prompt text" data-position="left center">L C</div>
<div style="height: 2rem"></div>
<div class="SnBtn block" data-tooltip="prompt text" data-position="right center">R C</div>
<div class="SnBtn block" data-tooltip="prompt text" data-position="left bottom">L B</div>
<div class="SnBtn block" data-tooltip="prompt text" data-position="center bottom">C B</div>
<div class="SnBtn block" data-tooltip="prompt text" data-position="right bottom">R B</div>

API

PropertyData
Type tooltipprompt text
Positionleft topcenter topright topleft centerright centerleft bottomcenter bottomright bottom