El componente de Tooltip es un pequeño cuadro emergente que aparece cuando el usuario mueve el puntero del mouse sobre un elemento.
Como crear un Tooltip
Para crear una información sobre herramientas, agrega el atributo data-toggle = «tooltip» a un elemento. Usa el atributo de título para especificar el texto que debe mostrarse dentro de la información sobre Tooltip.
Ejm
<a href="#" data-toggle="tooltip" title="Hooray!">Esto es un Tooltip</a>
Nota: La información sobre Tooltip debe inicializarse con jQuery: selecciona el elemento especificado y llama al método tooltip().
El siguiente código habilitará toda la información sobre Tooltip en el documento:
Ejm
<script>
$(document).ready(function(){
$('[data-toggle="tooltip"]').tooltip();
});
</script>
Posición de los Tooktips
Por defecto, la información sobre herramientas aparecerá en la parte superior del elemento.
Usa el atributo de colocación de datos para establecer la posición de la información sobre herramientas en la parte superior, inferior, izquierda o derecha del elemento.
Ejm
<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>