twitter-bootstrap
tooltip
Ricerca…
Osservazioni
Il suggerimento è un elemento dell'interfaccia utente che assomiglia a una piccola finestra pop-up. Solitamente viene attivato quando un utente passa il puntatore su un altro elemento, senza cliccarlo.
Per motivi di prestazioni, i tooltip devono essere inizializzati con jQuery. Il seguente codice abiliterà tutti i tooltip nel DOM:
<script>
$(document).ready(function(){
$('[data-toggle="tooltip"]').tooltip();
});
</script>
Tooltips di posizionamento
Per impostazione predefinita, il suggerimento apparirà in cima all'elemento. Possiamo usare data-placement attributo data-placement per impostare la posizione del tooltip in alto, in basso, a sinistra o a destra dell'elemento.
<a href="#" data-toggle="tooltip" data-placement="top" title="Top tooltip">Hover</a>
<a href="#" data-toggle="tooltip" data-placement="bottom" title="Bottom tooltip">Hover</a>
<a href="#" data-toggle="tooltip" data-placement="left" title="Left tooltip">Hover</a>
<a href="#" data-toggle="tooltip" data-placement="right" title="Right tooltip">Hover</a
Possiamo anche usare data-placement="auto" , per riorientare dinamicamente il suggerimento. Il tooltip nel prossimo esempio il tooltip verrà visualizzato a sinistra quando possibile, altrimenti verrà visualizzato a destra.
<a href="#" data-toggle="tooltip" data-placement="auto left" title="To the left?">Hover</a
Esempio di base
Per creare un suggerimento, è sufficiente aggiungere data-toggle="tooltip" attributo data-toggle="tooltip" e un title all'elemento HTML che avrà il suggerimento. L'attributo Title è usato per specificare il testo che viene visualizzato all'interno del tooltip.
<span data-toggle="tooltip" title="Hello world!">Hover over me</span>
