2 replies to this topic

[digital1984]

Olá,

Gostaria de Saber se é possivel criar um Imagem Hover em CSS / HTML, porém com duas imagens de tamanhos diferentes.

Ex.:

imagem1.jpg 100x100 px

Ao passar o mouse sobre a imagem1.jpg, deve abrir a imagem abaixo:

imagem2.jpg 200x200 px

Com as dimensões citadas acima.

É possivel?

Edição feita por: digital1984, 28/09/2011, 17:37.

[John L.F.S.]

Olá,

Gostaria de Saber se é possivel criar um Imagem Hover em CSS / HTML, porém com duas imagens de tamanhos diferentes.

Ex.:

imagem1.jpg 100x100 px

Ao passar o mouse sobre a imagem1.jpg, deve abrir a imagem abaixo:

imagem2.jpg 200x200 px

Com as dimensões citadas acima.

É possivel?

Sim porém não recomendado uma vez que normalmente isso quebra o layout.

[Gabriel Medina]

Seria + ou - assim:

CSS

#imagem img { width: 100px; height: 50px; background-image: url(imagem1.jpg); }
#imagem img:hover { width: 200px; heigth: 50px; background-image: url(imagem2.jpg); }

HTML

<div id="imagem"></div>