Efecto de descripción ☾


¡Hola! ¿Que tal? :)

Les traigo un efecto muy lindo para la descripción de nuestros blogs. (Cuando pasas el cursor por la imagen sale una nota). En lo personal me encanto. 

Para que lo tengas en tu blog.. sigue estos sencillos pasos.
- Plantilla / Editar html / CTRL + F
Buscamos:
]]></b:skin>

Encima de ese código, ponemos el siguiente.
.caixa1 {
width:230px;
height:150px;
padding:5px;
background:url(http://static.tumblr.com/koam7dd/Sr7nko391/teste_hover.png)no-repeat;
}
.descr {
background:rgba(255,255,255,0.9);
width:200px;
height:120px;
padding:10px;
opacity:0;
text-align: justify;
-webkit-transition: all 0.8s ease;
-moz-transition: all 0.8s ease;
transition: all 0.8s ease;
}
.caixa1:hover .descr, .box2:hover .descr { opacity:1; }
.outer {
border:1px solid #ddd;
width:230px;
height:150px;
padding:5px;
}
.top { margin:0 0 10px px; }
Rojo: El url de la imagen. (Trata de que sea del tamaño de la cajita de descripción)

- Ahora nos dirigimos a:

Diseño / Añadir gadget / HTML/JavaScript
<div class="outer top">
<div class="caixa1">
<div class="descr">¡Hola! bienvenido a mi blog, donde comparto: tutoriales, recursos, tips, ayudas, packs y otras cosas. Si te gusto el blog no olvides seguirlo para que no te pierdas ninguna entrada.</div>
</div>
</div>
Azul: El texto/nota, que quieras poner.

Eso es todo, espero les guste y lo pongan en su blog ^^
Créditos: gnhm

Hasta luego ♥


3 comentarios:

  1. holaaa!! oommgg que lindo efecto!
    gracias :D

    ResponderEliminar
  2. Hola! Quiero hacer el efecto pero no entiendo que hacemos con el codigo ]]>.
    ¿Lo borro? O que?
    Besos ♥

    ResponderEliminar
    Respuestas
    1. Con este código: ]]> (tienes que buscarlo) como se hace? fácil, aprietas estas teclas, ctrl + f. Al mismo tiempo, sale la barra de buscar y copias el código y arriba de el pegas el otro código que deje.

      Espero haberte ayudado, saludos. ♥

      Eliminar

¡Hey, gracias por leer la entrada!

- Sí vas a dejar un comentario que sea referente a la entrada.
- Comenta con respeto.
- No spam.
- No malas palabras.
- Respeta al administrador y a los usuarios del blog.
- Sí tienes problemas con un tutorial comenta, para poder ayudarte.

- Símbolos:
☯♠♤♣♧ ♥♡♦♢♔ ★✖ ✗✘✌✿☽ ☾♩ ♪ ♫ ♬ ✧ ❝❞ ❀ ❄

- Emojis:
(>‿◠)✌ (✿◠‿◠) (▰˘◡˘▰) ( ͡° ͜ʖ ͡°) (≧∀≦) ( ˘ ɜ˘) (・w・)[̲̅$̲̅(̲̅ ͡° ͜ʖ ͡°̲̅)̲̅$̲̅] (ノ◕ヮ◕)ノ*:・゚✧ ( ͡° ʖ̯ ͡°) ( ͡° ᴥ ͡°) ヽ(゚▽゚*)乂(*゚▽゚)ノ

Recuerda dejar la URL de tu blog para poder visitarlo.

Sí te gusto la entrada no olvides seguir el blog, así no te pierdes ninguna entrada.

Contacto:

(para cualquiera cosa idk)

gladiuskagg@gmail.com
-Glad.