Tay ♥ |
Bom, o efeito down é bem simples, porém eu achei bem fofinho e Eu achei esse efeito no Tumblr "HTMLuv!" , um tumblr com um layout super ultra mega fofo.
Live Preview - ♥
1- Coloque o seguinte código no seu CSS:
.efeitosf a span{ color: #000; padding: 5px; position: absolute; bottom: auto; left: auto; width: 180px;2- Depois coloque isso no gadget:
height: 30px; opacity: 0; text-align: left; text-shadow: 1px 1px 1px #fff; -webkit-transition-duration:
.90s;}
.efeitosf a:hover span{ background: #fff; <strong>height: 210px;</strong> opacity: 0.4;}
Com link:
Sem link:<div
class
=
"efeitosf"
>
<a href=
"LINK AO CLICAR NA IMAGEM"
>
<span>NOME QUE APARECE QUANDO PASSA O MOUSE</span>
<img src=
"LINK DA IMAGEM"
width=
"160px"
height=
"120px"
/> </a></div>
<div
class
=
"efeitosf"
>
<a>
<span>NOME QUE APARECE QUANDO PASSA O MOUSE</span>
<img src=
"LINK DA IMAGEM"
width=
"160px"
height=
"120px"
/> </div>
Créditos da imagem: Seraphic
Estou bem, obrigado por perguntar.
ResponderExcluirAmei esse efeito down, é muito fofinho ^w^
Visita? I I http://darkrss.blogspot.com.br/