Tooltip Plugin
Plugin-ul Tooltip este mic caseta pop-up care apare atunci când utilizatorul deplasează cursorul mouse-ului peste un element:
Sfat: Plugin - uri pot fi incluse în mod individual (using Bootstrap's individual "tooltip.js" file) , sau dintr -o dată (folosind "bootstrap.js" sau "bootstrap.min.js" ).
Cum Pentru a crea un Tooltip
Pentru a crea un tooltip, adăugați data-toggle="tooltip"
de data-toggle="tooltip"
atribut la un element.
Utilizați title
atribut pentru a specifica textul care trebuie să fie afișat în interiorul tooltip:
<a href="#" data-toggle="tooltip" title="Hooray!">Hover over me</a>
Notă: Bule trebuie inițializată cu jQuery: selectați elementul specificat și apelați tooltip()
metoda.
Codul de mai jos va permite toate ponturile din document:
Exemplu
<script>
$(document).ready(function(){
$('[data-toggle="tooltip"]').tooltip();
});
</script>
Încearcă - l singur » poziţionarea Bule
În mod implicit, tooltip va apărea în partea de sus a elementului.
Utilizați o data-placement
de data-placement
atribut pentru a stabili poziția tooltip pe partea de sus, de jos, stânga sau dreapta a elementului:
Exemplu
<a href="#" data-toggle="tooltip" data-placement="top"
title="Hooray!">Hover</a>
<a href="#" data-toggle="tooltip"
data-placement="bottom" title="Hooray!">Hover</a>
<a href="#"
data-toggle="tooltip" data-placement="left" title="Hooray!">Hover</a>
<a
href="#" data-toggle="tooltip" data-placement="right"
title="Hooray!">Hover</a>
Încearcă - l singur » Sfat: puteți utiliza , de asemenea, o data-placement
de "auto" data-placement
atribut cu o valoare de "auto" , care va permite browser - ul să decidă poziția tooltip. De exemplu, în cazul în care valoarea este "auto left" , tooltip va apărea în partea stângă atunci când este posibil, în caz contrar pe dreapta.
Finalizarea Bootstrap Tooltip de referință
Pentru o referință completă a tuturor opțiunilor tooltip, metode și evenimente, du - te la nostru Bootstrap JS Tooltip de referință .