Personalize seu Tooltip !

Hooy Gente !

Hoje vim mostrar a vc's, como personalizar seu Tooltip ..

Mas não esquecendo dos Créditos ..

O The Lovers

http://the-lovers-official.blogspot.com.br/

Para quem não sabe, é só passar o mouse na elite de afiliados. Viram uma caixinha colorida com o nome dos blogs? Então gente, aquilo é o tooltip. 

                                                            Ele irá ficar assim:

Tutorial  .

Vá em seu HTML, dê um CTRL + F e procure por:

</head>

Acima de  </head> cole o código:

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/><script language='JavaScript' src='http://static.tumblr.com/oiizew6/8B5lzwf17/script.js' type='text/JavaScript'/>

Agora, dê um CTRL + F novamente e procure por:

]]></b:skin>

Acima de ]]></b:skin> cole o código:

div#qTip {
padding: 3px;
background: #eee5de; /* Cor de Fundo*/
color: #8b8378; /* Cor da Fonte */
position: absolute;
z-index: 1000;
border: 1px solid #8b8378; /* Cor da Borda */
display: none;
font: bold arial;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}

Se você tiver uma elite de afiliados pronta, com certeza vai funcionar. Caso queira aplicar em outros lugares, irei ensinar agorinha!

Para links:

<a href='LINK_AQUI' title='TÍTULO DO LINK EM TOOLTIP'>NOME_DO_LINK</a>

Para imagens:

<img src='LINK_DA_IMAGEM' title='TÍTULO DA IMAGEM EM TOOLTIP'/>

Isso aê Gurias e Guris ..

Que Ótimo o Tutorial heiin ?

Graças ao The Lovers !