Yjsg v2 is equipped with simple CSS tooltips that you can use on any HTML elements.
| Options | Description |
|---|---|
data-yjsg-tip |
*Required option. Data attribute that contains the tooltip. |
class="yjsg-tip-left" |
Display tooltip on the left side. |
class="yjsg-tip-right" |
Display tooltip on the right side. |
class="yjsg-tip-top" |
Display tooltip above the element |
class="yjsg-tip-bottom" |
Display tooltip under the element |
<a class="button" href="#" data-yjsg-tip="I am CSS tooltip">
Default tooltip
</a>
<a class="yjsg-tip-left button" href="#" data-yjsg-tip="I am left tooltip">
Left tooltip
</a>
<a class="yjsg-tip-right button" href="#" data-yjsg-tip="I am right tooltip">
Right tooltip
</a>
<a class="yjsg-tip-bottom button" href="#" data-yjsg-tip="I am bottom tooltip">
Bottom tooltip
</a>