
Olá Bloggers :)
Tutorial saindo do forno agorinha, éle é bem legal usado em imagens, pode ser para os afiliados, equipe ou o que quiser :)
Visualizem ele aqui
Gostaram ?
Então continuem lendo :)
Aperte F3 ou CTRL+F e Procure por ]]></b:skin>.
Logo acime cole o código abaixo
#linked {
background: url(http://25.media.tumblr.com/tumblr_mcaon9zXd41r3rnp2o1_250.png) no-repeat;
width: 160px;
height: 160px;
display: inline-block;
box-shadow: inset 0 0 0 80px rgba(0, 0, 0, 0.4);
-webkit-transition: all 1s ease-out;
-moz-transition: all 1s ease-out;
-ms-transition: all 1s ease-out;
-o-transition: all 1s ease-out;
transition: all 1s ease-out;
}
#linked:hover {
box-shadow: inset 0 0 0 8px rgba(0, 0, 0, 0.4);
-webkit-transition: all 1s ease-out;
-moz-transition: all 1s ease-out;
-ms-transition: all 1s ease-out;
-o-transition: all 1s ease-out;
transition: all 1s ease-out;
}
Altere se quiser, apenas onde está em negrito.
Para usar é só adicionar um gadget HTML/Jasvascript com o código abaixo:
<div id="linked"></div>
amei o efeito *-* iricardodesigner.blogspot.com
ResponderExcluir