A dica Plugin
O plugin Tooltip é pequena caixa de pop-up que aparece quando o usuário move o ponteiro do mouse sobre um elemento:
Dica: Plugins podem ser incluídos individualmente (usando Bootstrap's individuais "tooltip.js" arquivo), ou todos de uma vez (usando "bootstrap.js" ou "bootstrap.min.js" ).
Como criar uma dica de ferramenta
Para criar uma dica de ferramenta, adicione a data-toggle="tooltip"
atributo para um elemento.
Use o title
atributo para especificar o texto que deve ser exibido dentro da dica:
<a href="#" data-toggle="tooltip" title="Hooray!">Hover over me</a>
Nota: As descrições devem ser inicializados com jQuery: selecione o elemento específico e chamar a tooltip()
método.
O código a seguir permitirá a todas as dicas de ferramentas no documento:
Exemplo
<script>
$(document).ready(function(){
$('[data-toggle="tooltip"]').tooltip();
});
</script>
Tente você mesmo " posicionamento Tooltips
Por padrão, a dica de ferramenta aparece na parte superior do elemento.
Use a data-placement
atributo para definir a posição da dica de ferramenta na parte superior, inferior, esquerdo ou do lado direito do elemento:
Exemplo
<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>
Tente você mesmo " Dica: Você também pode usar o data-placement
atributo com um valor de "auto", que permitirá que o navegador decidir a posição da dica. Por exemplo, se o valor for "auto left" , a dica de ferramenta será exibido no lado esquerdo quando possível, caso contrário, à direita.
Conclua Bootstrap Tooltip Referência
Para uma referência completa de todos os dica opções, métodos e eventos, ir ao nosso Bootstrap JS Tooltip Referência .