Capítulo 5 ■ Plugins
185
HTML e acionam os códigos JavaScript necessários para fazer funcionar o tooltip e na opção com JavaScript nativo o desenvolvedor precisa definir manualmente os métodos JavaScript próprios do Bootstrap para acionar o tooltip. O método nativo para inicializar um tooltip tem a sintaxe conforme mostrada a seguir. $('seletor').tooltip(options)
onde seletor é uma referência ao elemento container da palavra que dispara o tooltip. As opções para esse método são: Nome
Tipo
Default
animation
boleano
true
html
boleano
false
placement
string ou função
'top'
selector
string
false
title
string ou função
''
trigger
string
'hover focus'
delay
número ou object
0
container
string ou false
false
Descrição
Aplica o efeito fade ao mostrar/esconder o tooltip. O valor marcação HTML define que o conteúdo do tooltip será a marcação HTML aqui definida em lugar de texto simples. Define o posicionamento do tooltip em relação à palavra que o dispara. Os valores possíveis são: top, right, bottom e left. Admite ainda a combinação de auto com um dos quatro posicionamentos, por exemplo: 'auto left' que posiciona à esquerda quando há espaço à esquerda e à direita caso contrário. Essa opção permite que se delegue a função de disparar o tooltip a um determinado seletor. Isso faz com que seletores inseridos no DOM dinamicamente herdem a funcionalidade tooltip. Com uso dessa opção podemos definir um texto padrão para o tooltip. Para visualizar o texto padrão é necessário que o atributo title não seja definido no elemento container do tooltip. Se for definido, sobrescreverá o texto padrão. O valor para essa opção define o evento que dispara o tooltip. Os valores possíveis são: click, hover, focus e manual. É admitido usar mais de um valor e nesse caso devem-se separar os valores com espaço. O valor manual não pode ser combinado com outro valor. Define o tempo, em milissegundos, de retardo para abertura e fechamento do tooltip. Por exemplo, número: delay: 200 ou objeto: delay: { show: 100, hide: 200 }. Não se aplica para a opção trigger: “manual”. Define um container ao qual o tooltip será anexado. Por exemplo: container: '#janelaModal'.
Conheça os livros do Maujor: http://livrosdomaujor.com.br