quarta-feira, 20 de fevereiro de 2013

Efeito Suprise






Oii hj trouxe o efeito suprise os creditos vão para o blog World Of TuTOS . Aqui dá pra ter uma noção do que é, ele diz que é pra moderadores, eu discordo. Pode ficar bom em afiliados, não?

Vamos a o que interessa!

Cole acima de ]]></b:skin> o seguinte código editando  o que está em negrito. O resto deve ficar como está:

/*** efeito surprise ***/.mod {width:LARGURA-DA-CAIXApx; height:ALTURA-DA-CAIXApx; overflow:hidden; border:5px solid #F9CDAD; -webkit-transition-duration:0.7s; margin-top:3px}.imagem {width:LARGURA-DA-IMGpx; height:ALTURA-DA-IMGpx; -webkit-transition-duration:0.7s; position:absolute; overflow:hidden}.imagem:hover .texto {margin-top:0px; -webkit-transition-duration:0.7s;}.texto {background-color:#FUNDO-DO-TEXTO; color:#COR-DA-FONTE; font-size:10px; text-align:center; width:LARGURA-DO-TEXTOpx; height:ALTURA-DO-TEXTOpx; margin-top:-LARGURA-DA-CAIXApx; padding:5px; -webkit-transition-duration:0.7s; opacity:0.8;} 
Agora cole em uma caixa HTML o seguinte código:

<div class="mod"><img class="imagem" src="URL-DA-IMAGEM"><div class="texto"><br>texto aqui baby</div></div> 

2 comentários:

  1. Florzinha.
    Interessante hein?!
    Vou estudar isso ai e entender!
    Bjkss
    Sucesso!
    www.grazpin.blogspot.com.br

    ResponderExcluir
  2. Olá, passei por aqui, gostei do seu blog. Um Abraço!

    http://elaecrista.blogspot.com.br

    ResponderExcluir