Efeito equipe do blog

12 de ago de 2013

PREVIEW

Créditos:(www)
1.  Vá em Editar HTML, abra a primeira setinha, e procure por ]]></b:skin>. Acima dessa tag, cole:
.slide-up-boxes {width: 133px; display: inline-block; margin-left: 6px;}

.slide-up-boxes a {

display: block;

margin: 0 0 0px 0;

background: #fff;
height: 98px;
margin-bottom: 5px;
overflow: hidden;
text-decoration: none;
box-shadow: 0 5px 2px -2px rgba(0,0,0,0.11);}
.slide-up-boxes h5 {
color: #937560;
text-align: center;
height: 109px;
text-shadow: 1px 1px 0px #eee;
letter-spacing: 5px;
text-transform: uppercase;
font: normal 11px/104px Arial;
opacity: 1;
-webkit-transition: all 0.2s linear;
-moz-transition: all 0.2s linear;
-o-transition: all 0.2s linear;
}
.slide-up-boxes a:hover h5 {
margin-top: -114px;
opacity: 0;}
.slide-up-boxes div
{position: relative;
color: #fff;
height: 114px;
padding: 5px;
opacity: 0;
-webkit-transform: rotate(6deg);
-webkit-transition: all 0.4s linear;
-moz-transform: rotate(6deg);
-moz-transition: all 0.4s linear;
-o-transform: rotate(6deg);
-o-transition: all 0.4s linear;
text-decoration: none;}
.slide-up-boxes a:hover div {opacity: 1;
-webkit-transform: rotate(0);
-moz-transform: rotate(0);
-o-transform: rotate(0);}
2. Vizualize e Salve

 3. Crie um gadget de HTML/JavaScript, e cole o código abaixo, substituindo sempre o que está em destaque:
<div class="slide-up-boxes">
<a href="URL DO SITE">
<h5>
<img src="URL DA 1° IMAGEM" />
</h5>
<div>
<img src="URL DA 2° IMAGEM" />
</div></a></div>
 Entenda
URL do site é o link do blog do postador.
URL da 1° imagem é o link da imagem normal.
URL da 2° imagem é o link da imagem em Hover. 

2 comentários :

Mariia Martins disse...

òtimo tutoriar amei
Oiie linda tenha um belo dia, Qu Deus abençoe seu blog e se puder retribuir a visita eu agradeço
Beijos Maria
Complicada & Imperfeita* Adolescente*

Thamiris Lara disse...

Obg Flor,que vc tenha um dia belo também...Bjs

Postar um comentário

Seu Comentários é sempre bem vindo!
Comente,opine,se expresse! Este espaço é seu!
Comentar faz parte,então por favor deixem comentários

-Todos os comentários são moderados e só ficarão disponíveis ao serem aprovados
-A área de comentários não é casa da mãe Joana,então tenha respeito.Não use palavrões,nem insultos,ofensas,agressões e baixarias;
-Não serão aceitos comentários Anônimos,comentários repetidos,e que tenham qualquer material publicitários ou de merchandising pessoal ou de benefício de terceiros
-Contatos pessoais devem ser feitos na pagina de contato.
-Não deixe links desnecessários os comentários

AVISOS:

--Blog não é Chat,respeitadas as regras ,é livre o debate dos assuntos aqui postados,Que o espaço de comentários não sirva para bate papo sobre assuntos de caráter pessoal ou estranhos ao blog
--A tentativa de clonar nomes e apelidos de outros usuários para emitir opiniões em nome de terceiros configura crime de falsidade ideológica.

Espero que tenham gostado do blog e que volte sempre!