Системата на Bootstrap е изключително богата на функционалност и възможности. Едно допълнително полезно нещо е така наречените подсказки или tooltips. В този урок ще разберем как да активираме плъгина за подсказки и как да го използваме след това.
Приставката на Bootstrap за подсказки – как се ползва
Плъгина Tooltip е малка pop-up кутийка, която се появава когато потребителя постави или просто мине с мишката над съответният елемент:
Плъгините може да се включват индивидуално(ползвайки Bootstrap’s отделния „tooltip.js“файл), или всичките заедно наведнъж (ползвайки “bootstrap.js” или “bootstrap.min.js”).
Как се създава Tooltip
tooltip създаваме като добавим атрибута data-toggle="tooltip" към някакъв елемнт.
Употребата на атрибута title е за да зададем текста, който ще се появи в tooltip:
Обърнете внимание, че: Tooltips трябва да са инициалицирани с jQuery: избираме определен елемент и извикваме метода tooltip().
Следващият код ще разреши употребата на tooltips в целият документ:
Как се позиционира Tooltips
По подразбиране tooltip ще се покаже отгоре на елемента.
Употребата на data-placement атриута задава позиция на tooltip – top, bottom, left или right:
Може да ползваме data-placement атрибута със стойност „auto“, която ще остави браузъра да определи позичията на tooltip. Например, ако стойността е „auto left“, tooltip ще се покаже отлява приоритетно ако е възможно иначе от дясно.