[Tutorial] Transição de imagens em CSS3


Crie transições em suas imagens de modo simples sem utilizar javascript!

1. No seu CSS, adicione:
/* Tutoriais Cor Seletiva */
 #tran-image img{
 display:block;
 position:absolute;
 transition:all 2s linear; -moz-transition:all 2s linear;
 -webkit-transition:all 2s linear; -o-transition:all 2s linear;
 }
 #tran-image img:hover{
 transition:all 2s linear; -moz-transition:all 2s linear;
 -webkit-transition:all 2s linear; -o-transition:all 2s linear; opacity:0;
 }

2. Para que apareça suas imagens, utilize o código abaixo, lembre-se de sempre utilizar imagens do mesmo tamanho.
<div id="tran-image">
 <img src="www.LINKDASUAIMAGEM.com">
 <img src="www.LINKDASUAIMAGEM-AO-PASSAR-O-MOUSE.com">
 </div>
 :: Créditos: Cor Seletiva

Nenhum comentário:

Postar um comentário

Deixe seu comentário