Como criar e posicionar uma dica de ferramenta no bootstrap 5
Tooltip é uma pequena caixa pop -up que aparece quando um usuário move o cursor sobre um botão ou um link que dá ao usuário, conhecimento ou uma dica sobre esse botão ou link específico. As dicas de ferramentas são úteis para os novos usuários de um site para salvá -los de confusão ou qualquer tipo de problema ao explorar seu site.
Este artigo lhe ensinará sobre
- Criando dicas de ferramentas no bootstrap 5
- Posicione dicas de ferramentas
Como criar dica de ferramenta
Para criar uma dica de ferramenta, o atributo de dados “data-bs-toggle = ”ToolTip" na tua tag ou tag e o texto que é mostrado na dica de ferramenta deve ser escrito usando o atributo de título.
Dica de ferramenta com link
Coloque o cursor aqui
Dica de ferramenta com o botão
$ (documento).pronto (function ()
$ ('[data-bs-toggle = "Tooltip"]').ferramentatip ();
);
Agora, deixe -me dizer -lhe que no bootstrap 5 para criar uma dica de ferramenta, precisamos adicionar atributos de dados em tag ou tag e também escreva um jQuery para ativá -lo. Então, eu divido o processo de criação em etapas que lhe darão melhor compreensão.
Passos
Criar uma dica de ferramenta no bootstrap 5 é um processo simples de duas etapas
Passo 1: Adicionar Data-Bs-toggle = "ToolTip" e Title = "Tooltip Text Goes aqui" atributos em seu ou tag.
Dica de ferramenta com link
Coloque o cursor aqui
Dica de ferramenta com o botão
Passo 2: Ativar dicas de ferramentas escrevendo o código seguinte
Posicionamento de dicas de ferramentas
Então, para posicionar uma dica de ferramenta como sua exigência apenas Adicionar atributo data-bs-posting = "top/direita/esquerda/inferior" para o seu ou tag Para alterar a posição da dica de ferramenta.
Conclusão
As dicas de ferramentas são criadas adicionando Data-Bs-toggle = "ToolTip" e Title = "Tooltip Text Goes aqui" atributos em ou tag e habilitá -lo escrevendo um código JavaScript. Para posicionar apenas Adicione o atributo data-bs-posting = "top/inferior/direita/esquerda" ou tag.