2 Modelos de Tooltip (Exclusivos)

|| ||
Arigato gozaimasu pelos 706 seguidores

Oi gente!!! Confesso que esses dias eu estava muito próxima da minha amiga preguiça e por isso não estava muito presente aqui no blog, pensei em postar ontem, mas como fui na feira do livro e cheguei tarde, então resolvi postar hoje. E esses tooltip foi um pedido lá na ask e resolvi fazer só dois acabei de falar o porque de só dois.

Para que o tooltip funcione procure por </head> e cole o seguinte código acima dessa tag:
<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'/>
Para colocar o tooltip escolhido vá em Modelo>> Editar HTML>> Clique dentro da caixa de HTML e depois aperte Ctrl+F e procure por:
]]></b:skin>

Tooltip #1
div#qTip {
padding: 6px;
border: 1px solid #ff7766;
border-radius: 15px;
box-shadow: inset 1px 1px 0px #fff;
display: none;
background: #ffcccc;
color: #FFF;
font: bold 8px Verdana, Arial, sans-serif;
text-align: left;
position: absolute;
z-index: 1000;
}

Tooltip #2
div#qTip {
padding: 6px;
border: 1px solid #ff7766;
border-radius: 0px 100px 100px 0px;
box-shadow: inset 1px 1px 0px #fff;
display: none;
background: #ffcccc;
color: #FFF;
font: bold 8px Verdana, Arial, sans-serif;
text-align: left;
position: absolute;
z-index: 1000;
}

Obs.: O tooltip personalizado só aparece quando a página está totalmente carregada.
Espero que gostem desses modelos!!!