Tutorial - Efeito hover top

Hi galera, tudo bem? Espero que sim! Eu to bem! Vim hoje fazer o meu primeiro tutorial neste blog \oo/ é o efeito "HOVER TOP" eu o encontrei no tumblr, porém transformei para blogger, então os divos créditos para Cssand-Html!
O efeito é lindo, para ver ele clique aqui e no primeiro gadget passe o mouse e veja o efeito! Se gostou comente e faça o tutorial!



No seu html procure por:

]]></b:skin>

 É só apertar o ctrl + f ou f3

Acima da tag encontrada cole:

#imgbaixo {background:url(URL DA FOTO);width:300;height:400px;}

.imghover{width:300;height:400px;}

.imghover:hover{margin-top:-50px;-webkit-transition-duration: .99s;filter:alpha(opacity=0);-moz-opacity:0.0;opacity:0.0;}

Aonde tem URL DA FOTO troque pelo url da primeira foto, a que vai aparecer quando passar o mouse! E aonde tem 300 e 400 troque pelo tamanho da foto!

Agora adicione um gadget html/Java script e cole o código abaixo:

<div id="imgbaixo">
<img src="link da foto" class="imghover">
</div></div>

Sabe o que mudar né? Bjoo na bunda só volto segunda kkkk!