3 de set. de 2014

Efeito Queen para Moderadores

   
Bom dia queridos e queridas leitores do meu querido queridíssimo blog.. rsrsrsrs como está essa manha?? bom sei que a maioria poderá ler essa postagem a tarde pois vocês estudam né minha gente! eu só trabalho mesmo... Gente obrigada pela participação de vocês aqui no Only Dreams, mesmo com a blogosfera tão paradinha.. Bom eu estou ficando animada com os resultados do blog e isso que esta me motivando a continuar postando todos os dias.. estou indo afundo em busca de coisas legais, criativas interessantes para vocês.. É que depois de tanto tempo com o blog parado decidi me dedicar ao máximo a ele, pois não foi fácil chegar até aqui e seria muito triste simplesmente larga-lo depois de tanto sacrifício para ele crescer, pelos menos um porquinho.. Falando sobre a postagem de hoje eu trouxe um efeito muito lindo para você usar na sua elite de afiliados ou nos moderadores de seu blog..

Ver a Preview do Efeito

01- Passo: Procure pela tag  ]]></b:skin>  e acima dela coloque o código abaixo.

/** EFEITO QUEEN **/
.queen a, .queen a img {display: inline-block;}
.queen a {width: 160px; height: 200px; position: relative; padding: 5px; background: #ffcccc; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px 4px 4px 4px;}
.queen a span {position: absolute; width: 160px; height: 200px; top: 5px; left: 5px; text-align: center; line-height: 16px; color:#000;font-size: 18px; opacity: 0; filter: alpha(opacity=0); background: rgba(255,255,255,0.8); transition-duration: 2s; -webkit-transition-duration: 1s; -moz-transition-duration: 2s;}
.queen a:hover span{opacity: 1; filter: alpha(opacity=99);}


02- Passo: Agora coloque o código abaixo aonde você quer que o efeito apareça.

<div class="queen">
<a href="https://www.blogger.com/"><img src="SUA IMAGEM AQUI" />
Algo aqui</a>
<a href="https://www.blogger.com/"><img src="SUA IMAGEM AQUI" />
Algo aqui</a>
<a href="https://www.blogger.com/"><img src="SUA IMAGEM AQUI" />
Algo aqui</a>
</div>

19 comentários:

  1. bacana, nao conhecia esse efeito

    www.tofucolorido.blogspot.com
    www.facebook.com/blogtofucolorido

    ResponderExcluir
  2. Não deu pra ver o preview, mas com certeza o efeito deve está bem legal *--* depois confiro de novo!

    Abraços, Crazy Things

    ResponderExcluir
    Respostas
    1. Como eu sou idiota, o blog de testes estava trancado.. desculpa mesmo.. já ta livre!!

      Excluir
  3. Adorei *-* curto muito efeitos de descrição em imagens .
    Até mais xD

    xxotakulovexx.blogspot.com

    ResponderExcluir
  4. Fofura de efeito c: Amei seu blog.
    Retribuindo a visitinha... Beijos
    http://www.blogblackrose.com/

    ResponderExcluir
  5. Adorei o efeito, acho que vou usar no próximo lay do blog...

    Kissus | Além da Imaginação

    ResponderExcluir
  6. Adorei o efeito, ficou muito fofo e talvez o use >33<

    www.excepcionalmente.com

    ResponderExcluir
  7. Adorei o efeito. Pena que não vai da para eu usar já que não tenho elite de afiliados.

    www.youngblood.blog.br

    ResponderExcluir
  8. Adorei o efeito! Se eu me aventurar a fazer layout, provavelmente vou usar!

    Bjs,
    un--cover.blogspot.com

    ResponderExcluir
  9. Realmente a blogosfera está parada e após ter lido isso em tantos posts de outros blogs me tenho apercebido de que realmente as coisas não são como antes, está tudo meio abandonado e isso desanima bastante quem voltou para o blogger (meu caso) ou quem criou novos blogs. Muitos estão a fazer um esforço para continuar a publicar e assim, mas claro que desanima e tal ~ ;-;

    O efeito está interessante, por acaso, acho que não conhecia mas gostei, esse efeito também dá para fotos mais pequenas, certo? Como ícones, por exemplo?

    kuroihana.co.vu/

    ResponderExcluir