Efeito de transicao simples em imagens

Boa noite xexelentos da minha vidinha,  tudo bem? (ゝω♡ ) Demorou mas estou aqui novamente, estava um pouco ocupada com alguns trabalhos da faculdade, mas agora já estou de boas. Eu estou ficando gripada e meu corpo está doendo muito, tomara que eu não fique pior pois trabalhar com o corpo doendo e com ranho saindo do nariz não é legal. Eu estava pensando no que iria fazer, o que postar e dai lembrei deste efeito, na verdade já era para ter feito esse post a muito tempo...

Gente, e se seu falar que a mão já está coçando para trocar de layout? Sério mano, eu já estou com algumas ideias, porém irei esperar até abril pois vai ter comeback dos meus amados do BTS e da Taeyeon e dai quero ver qual será o conceito deles. O que eu mais gostar vai ser o novo tema daqui, sei que já fiz uns trocentos temas deles mas nunca me canso de criar layout com eles de tema. Da Taeyeon por outro lado seria inédito, então vamos esperar até lá para ver o que acontece >ω<

LIVE PREVIEW (*>3<'')

Para usar o efeito vá até o seu tema e dentro procure por: ]]></b:skin> e quando achar acima dele cole o seguinte código:

#fofura {width: 215px; height:150px; display: inline-block; overflow: hidden; position: relative; border: 6px solid #dce6ee;
}
.imagem1 {width: 215px; height:150px;margin-left: 0px; -webkit-transition-duration: .5s; -moz-transition-duration: .5s; -o-transition-duration: .5s;
}
.imagem2 {width: 215px; height:150px;position: absolute; left: 250px; top: 0px; -webkit-transition-duration: .5s; -moz-transition-duration: .5s; -o-transition-duration: .5s;
}
#fofura:hover .imagem1 {margin-left: -250px;
}
#fofura:hover .imagem2 {left: 0px;
}

Para usar as imagens em algum lugar crie um gadget  e dentro cole:

<div id="fofura">
<a href="/" title="nome do abigo aqui"
target="_blank"><img src="https://i.imgur.com/qmDI55c.png" class="imagem1"/>
<a href="/" title="nome do abigo aqui"
target="_blank"><img src="https://i.imgur.com/XqhQvih.png" class="imagem2"/>
</div>

Vocês podem mudar o tamanho da imagem e as cores da borda em volta da imagem.