Bootstrap 4 Descrizione comando
Bootstrap 4 Descrizione comando
Il componente Tooltip è una piccola finestra pop-up che appare quando l'utente sposta il puntatore del mouse su un elemento:
Come creare una descrizione comando
Per creare una descrizione comando, aggiungi l' data-toggle="tooltip"
attributo a un elemento.
Utilizzare l' titleattributo per specificare il testo da visualizzare all'interno del suggerimento:
<a href="#" data-toggle="tooltip" title="Hooray!">Hover over me</a>
Nota: le descrizioni comandi devono essere inizializzate con jQuery: selezionare l'elemento specificato e chiamare il tooltip()metodo.
Il codice seguente abiliterà tutti i suggerimenti nel documento:
Esempio
<script>
$(document).ready(function(){
$('[data-toggle="tooltip"]').tooltip();
});
</script>
Suggerimenti per il posizionamento
Per impostazione predefinita, la descrizione comando apparirà sopra l'elemento.
Utilizzare l' data-placementattributo per impostare la posizione della descrizione comando sul lato superiore, inferiore, sinistro o destro dell'elemento:
Esempio
<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>
Riferimento completo della descrizione comandi di Bootstrap
Per un riferimento completo di tutte le opzioni, i metodi e gli eventi dei tooltip, vai al nostro Bootstrap JS Tooltip Reference .