MY SPELE
+380678383535
team@spele.ua

Подсказки

Зачастую разрабатывая функционал, возникает потребность в дополнительной всплывающей информацией, которая будет отображать подсказки или дополнительные данные. Для инициализации всплывающей подсказки необходимо использовать класс .js-tooltip , текст самой подсказки прописать в атрибут title=””

 

<a href="#" class="ob-button js-tooltip" title="Text description">Hover me!</a>


Пользовательский шаблон подсказки

Для инициализации всплывающей подсказки необходимо использовать класс .js-tooltip-custom, а так же атрибуты data-content и data-position, которые будут содержать параметры инициализации. 

 

Сам же контент кастомной подсказки необходимо разместить в блоке с классом, который вы укажите в атрибуте data-content и скрыть его (style="display: none;"). А атрибут data-position нужен для указания положения подсказки (left, right,top или bottom). 

 

<a href="#" class="ob-button js-tooltip-custom" data-position="right" data-content="my-custom-tooltip">Hover me!</a>

<div class="my-custom-tooltip" style="display: none;">
 Привет!<br>
 У меня собственный шаблон, с <strong>HTML</strong> структурой.
 <br>Это здорово!
</div>