22 fevereiro 2014

Tutorial: Oque é tooltip? + Personalizando o Tooltip


Olá Pessoal! Tudo bem com vocês? Bem aqui continua tenso daquele jeito, minha mãe adora fazer ameaças pra mim botando sempre o blog no meio acredita?  Ela diz que eu não tenho futuro na blogosfera, porém essa não foi a minha maior preocupação, a maior mesmo foi que eu tenho um trabalho pra segunda que é em trio e eu estou de "invasora" no grupo das minhas 3 amigas, não sei nem se a tia irá deixar fazer trabalho de 4 pessoas porém eu estou sem grupo e está muito tenso porém hoje eu vim ensinar aqui um tutorial para vocês lá do falecido Cherry Bomb =c Que é personalizar o tooltip, pra quem não sabe o tooltip é aquela mensagem que aparece em uma caixinha branca com a fonte preta que aparece nos link's como descrição sabe? Se não entendeu eu fiz uma gif ridicula tentando explicar. Olhem:


Ridiculo como vocês podem ver eu sou pessima com tempo de gif mais esquecendo isso vamos ao tuto?
Entre no HTML do seu blog (Modelo > Editar HTML), clique em qualquer código depois dê CTRL + F e nessa caixinha escreva: <head> 

Agora cole esse código abaixo de <head> 
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js'
type='text/javascript'/>
<script language='JavaScript' src='http://yourjavascript.com/1411249631/qTip.js'

type='text/JavaScript'/>

Vá na caixinha de pesquisa novamente e procure por ]]></b:skin> e acima de ]]></b:skin> cole o seguinte código:
div#qTip {
padding: 3px; /*Espaço entre a borda e o texto*/
border: 1px solid #666; /* Estilo da borda */
display: none; /*Não mexa*/
background: #999; /* Cor de fundo */
color: #fff; /*Cor da fonte*/
font-family: Verdana; /*Tipo de fonte*/
font-size: 9px; /*Tamanho da fonte*/
position: absolute; /*Não mexa*/
z-index: 1000; /*Não mexa*/}
Agora modifique as cores e fontes como quiser depois salve! Lembrando que se vc não por o código abaixo de <head> o tooltip não irá funcionar! Kissus

Créditos no começo do post - 

Nenhum comentário:

Postar um comentário

Quer comentar? Leias as regras abaixo! =3

♡ Deixe o URL do seu blog no final dos comentários para eu visitar! Se eu gostar eu sigo!

♡ "Seguindo, segue de volta?" Simplesmente irei ignorar, mas se quiser que eu siga comenta algo haver com o post e no final ponha o link do seu blog, se eu gostar eu sigo!

♡ Sem xingamentos, grosserias, etc!

♡ Faça Criticas Construtivas, sem ofensas!

♡ Fico muito feliz se vc comentar! Kissus