Efecto gota #3

Hola.

Tiempo sin pasarme por aquí, siento mucho mi ausencia en el blog, no tengo ánimos ni ideas.

Además se había perdido mi gata coco, y hoy llego a la casa, esa es una de las razones, tratare de publicar más en el blog. Pero de otras cosas, que no sean recursos y tutoriales. Si quieren que publique algo díganme en los comentarios.

Les traigo un nuevo efecto, que lo saque del blog: gnm-h

Créditos a ese blog.

Previa:

Clic aquí para ver.

Nos vamos para:

Plantilla | Editar HTML | CTRL + F

Y buscamos:

]]></b:skin>

Arriba de ese código ponemos este:

/** Efeito gota by gnmh **/
.gota { background:#ccc;border:solid 3px #fff;box-shadow: inset 0 0 6px #ccc, 0px 1px 1px #ccc;border-radius:50px 50px 0px 50px;-webkit-transition-duration: .90s;opacity:0.7;}
.gota:hover {border-radius:0px 50px 50px 50px;-webkit-transition-duration: .90s;background:#fff;Border: 3px solid #ccc;box-shadow: inset 0 0 6px #D4E3E8, 0px 1px 1px #ccc; }

Guardas, y vamos a (Diseño/JavaScript)

<a href="link" target="blank" title="nota"><img class="gota" src="link de la imagen" height="60" width="60" /></a> 

Para editar:

Link: El link de la pagina.

Nota: Cualquiera nota/mensaje que quieras poner.

Link de la imagen: El link de la imagen.

¡Listo, le das guardar!

Eso es todo, espero les allá gustado, no olviden los créditos.

Hasta luego.