Quero criar tipo uma galeria de fotos, mas é o seguinte, dentro de uma <div>
ficam várias fotos que, mesmo não sendo do mesmo tamanho, serão mostradas do mesmo tamanho (e um tamanho menor para que todas caibam na tela)!
Ao passar o mouse sobre as imagens, elas aumentariam para seu tamanho real. Tentei usar o seguinte código:
-webkit-transform: scale(1.3);
-ms-transform: scale(1.3);
transform: scale(1.3);
Mas o problema, é que com isso, a imagem fica "desfocada". Queria esse mesmo efeito (ou efeito parecido), mas sem perder a qualidade da imagem. Alguém sabe como faço isso?
transform: scale()
, então não tenho certeza, mas se o comportamento dele é dar zoom no elemento da forma que ele é mostrado, você devera procurar uma forma alternativa de obter esse efeito.transform: scale(0.7)
e no:hover
colocatransform: scale(1)