ToolTips

Tooltips

Hola blogueras como estan? espero que muy bien, disfrutando de este lindo fin de semana ^^, yo les traigo este tuto que me han pedido y es sobre el "Tooltip" y se preguntaran que es eso?? haha bueno el tooltip es una cajita con un mensaje que es visible solo cuando pasas el mouse encima de un link..

Nos vamos a Plantilla >> Edicion de Html >> Continuar >> Pulsamos (Ctrl + F) y buscamos </head>

pegamos este codigo antes 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://static.tumblr.com/oiizew6/8B5lzwf17/script.js' type='text/JavaScript'/>
<style>
div#qTip {
padding:3px 5px 3px 26px;
border-top-left-radius: 10px;
border-bottom-right-radius: 10px;
border: 1px solid  #bebebe;
border-left: 3px solid  #ff34b3;
border-right: 3px solid  #ff34b3;
-moz-border-radius: 1em 4em 1em 4em;border-radius: 1em 4em 1em 4em;border-bottom-width: 2px;
display: none;
background:#fff  url(http://i1190.photobucket.com/albums/z449/_KawaiiCherryCupCake_/Annyz_Blog/minigifsbyannyzblog56.gif)no-repeat 5%;
color: #000000;
font-family: Century Gothic;
font-size: 14px;
text-align: left;
position: absolute;
z-index: 1000;
}
</style>

personalizando:

Color: forma del borde

Color: Grosor, tipo y color del borde de arriba y abajo

Color: Grosor, tipo y color del borde de derecha e izquierda.

Color: Minigif de tu preferencia.

Ahora solo das guardar y listo :) 

Aqui algunos gifs

Nos Vemos!