Hooy Gente !
Hoje vim mostrar a vc's, como personalizar seu Tooltip ..
Mas não esquecendo dos Créditos ..
O The Lovers
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.
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;
}
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 !
