29 de mai de 2013

Personalizando seu Tooltip


Yoo minna-san hehe
 Sim! Eu estou viva para a alegria de vocês e estou bem u_u Já tomaram a vacina pra gripe? Eu não lerelê 'vida loka'...Parei. Gente, eu estou em love com Ulzzang's...Por que tão lindas? Embora usem quilos de maquiagem e-e Bem, hoje eu trouxe um tutorial que a maioria dos blogs usam, na verdade acho que todos usam em seus blogs. O tutorial é sobre personalizar o seu tooltip.
- Mas o que é tooltip?
Acho que todo mundo já sabe o que é, mas mesmo assim não custa nada falar. Um lugar onde usamos o tooltip é, por exemplo, quando passamos o mouse sobre o 'Leia Mais' e aparece uma barrinha com o nome da postagem.
Se você quiser saber como faz isso, read more baby ~~

Procure em sua HTML por </head>
Depois que achar, cole acima da tag o seguinte 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 e procure por ]]></b:skin>
Acima da tag cole
div#qTip {
padding: 3px;
background: COLOQUE AQUI A COR DE FUNDO ;
color: COLOQUE AQUI A COR DA FONTE;
position: absolute;
z-index: 1000;
border: EXPESSURA DA  BORDA ESTILO DA BORDA  COR DA BORDA ;
display: none;
font-family: COLOQUE AQUI A FONTE;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}

Edite o código de acordo com os seus gostos. Na parte da border dê um espaço entre o que pede ok? Por exemplo: 1px solid #00000; Na última parte em sublinhado, é para arredondar. Se você não quiser, apague essa parte inteira.

4 comentários:

  1. Somos duas vida loka então, UHAEEUA' Nem tomei a vacina também, u_u' Só que olha, eu sou mais vida loka que você, hein, fica esperta cabrita u3u

    Adorei o tutorial, muito útil ♥

    Beijos,

    Juu-Chan do Nescau com Nutella.

    ResponderExcluir
    Respostas
    1. Pódexa tia u_ú SHAUSHAUSH
      Que bom que você gostou <3

      Excluir
  2. Eu também não tomei minha vacina, V1D4 L0K4 u.u sdfghjasaghsj.
    Bem legal o tutorial, as vezes eu tenho preguiça de editar meu tooltip :| hihi

    Beijos,
    Poison HTML

    ResponderExcluir
    Respostas
    1. SHUASHAUS geral vida loka õ/
      Minha irmã que faz os Layouts para mim por que eu não sei fazer as coisas direitos e-e ~~inútil

      Excluir