CSS3 Tips — плагін, написаний тільки на CSS3. Правда, використовує параметри HTML5.
Можливості
- Завдяки HTML5 параметрами можна легко керувати.
- Чотири можливих напрямки.
- Сучасний стиль.
- Жодного JavaScript.
- Зміна за допомогою CSS.
Installation
Syntax
<span class="top-tip" data-tips="TOOLTIP TEXT">TEXT</span>
Параметри
| Параметр (атрибут HTML) | Опис | Можливі значення |
|---|---|---|
class
|
Клас в CSS. Він відповідає за напрямок підказки. | top-tipleft-tipbottom-tipright-tip
|
data-tips
|
Сюди додається текст підказки. |
Demo
- Hover them to see the tooltip positions.
Top tooltip
Right tooltip
Left tooltip
Bottom tooltip
Alternative Stylesheet Demo
Click the following button to open a modal and preview the alternative tooltips' appearance.
See also
- TippingOver - an extension similar to Tooltips.js.
- Tooltips - a tooltip plugin with advanced configuration.
- WdsTooltips - a tooltip that works on both mobile and desktop.