Como Colocar Zoom na Imagem do Blog

Olá hoje, vou ensinar como dar um ZOOM nas imagens do Blogger com CSS, para vizualizar o efeito basta passa o mouse sobre a imagem abaixo:






Agora vamos fazer é bem simples:


 Acesse  o Painel de Controle do seu blog, Vá em Modelo >> e clique em : Personalizar.





Vá em Avançado >> Clique em Adicionar CSS .




E cole o código abaixo :


.post-body img {

-webkit-transition: all 0.15s linear;
-moz-transition: all 0.15s linear;
transition: all 0.15s linear;
}

.post-body img:hover{

border:1px solid #000;
-webkit-transform:  scale(1.302);
}

Clique em Aplicar no Blog e pronto.



Observaçao: 

A onde eu deixei em verde("1px"), é a espessura da borda da imagem em Zoom. Para mudar a espessura é só mudar o seguinte valor em verde("1") .

2º  A onde eu deixei em Azul("#000"), é a cor da borda da imagem em Zoom. Para mudar a cor é só mudar o seguinte código em azul("#000") pela cor desejada.

3º  A onde eu deixei em  vermelho("1.302"), é o tamanho do Zoom. Para mudar o tamanho é só mudar o seguinte código em vermelho("1.302") pelo tamanho desejado.

Pronto, estará bem bonito no seu blogger.Por Favor curta minha page no Facebook,obrigado e até a proxima.


Escrito por

Comentários
0 Comentários

0 comentários: