Foros del Web » Creando para Internet » CSS »

Problemas con hover

Estas en el tema de Problemas con hover en el foro de CSS en Foros del Web. Hola buenos días, llevo poco tiempo con CSS pero estoy atascada, tengo un problema inserto una imagen en una página y luego quiero que esa ...
  #1 (permalink)  
Antiguo 06/02/2013, 03:22
 
Fecha de Ingreso: febrero-2013
Mensajes: 1
Antigüedad: 11 años, 9 meses
Puntos: 0
Pregunta Problemas con hover

Hola buenos días,
llevo poco tiempo con CSS pero estoy atascada, tengo un problema inserto una imagen en una página y luego quiero que esa imagen según pase el ratón se haga más grande.(o que rote que tampoco me funciona) Lo he probado en todos los navegadores y siguen sin funcionar.Pongo el código a ver si alguien me puede ayudar.
Código html.
<img class="imagenes" src="Pinguino.jpg" />

Código Css
img.imagenes{
transform:scale(1,1);
-o-transform:scale(1,1);
-moz-transform:scale(1,1);
-webkit-transform:scale(1,1);
-ms-transform:scale(1,1);
transition:transform 1s;
-o-transition:-o-transform 1s;
-moz-transition:-moz-transform 1s;
-webkit-transition:-webkit-transform 1s;
-ms-transition:-ms-transform 1s;
}
img.imagenes:hover{
transform:scale(1.5,1.5);
-o-transform:scale(1.5,1.5);
-moz-transform:scale(1.5,1.5);
-webkit-transform:scale(1.5,1.5);
-ms-transform:scale(1.5,1.5);
}

Gracias
  #2 (permalink)  
Antiguo 06/02/2013, 08:16
Avatar de C2am  
Fecha de Ingreso: enero-2009
Ubicación: Rosario, Argentina
Mensajes: 2.005
Antigüedad: 15 años, 10 meses
Puntos: 306
Respuesta: Problemas con hover

Hola y Bienvenida al Foro.
Primero una observación: usa el highlight para postear código, lo cual hace que sea más fácil de leer:
Código CSS:
Ver original
  1. img.imagenes{
  2. transform:scale(1,1);
  3. -o-transform:scale(1,1);
  4. -moz-transform:scale(1,1);
  5. -webkit-transform:scale(1,1);
  6. -ms-transform:scale(1,1);
  7. transition:transform 1s;
  8. -o-transition:-o-transform 1s;
  9. -moz-transition:-moz-transform 1s;
  10. -webkit-transition:-webkit-transform 1s;
  11. -ms-transition:-ms-transform 1s;
  12. }
  13. img.imagenes:hover{
  14. transform:scale(1.5,1.5);
  15. -o-transform:scale(1.5,1.5);
  16. -moz-transform:scale(1.5,1.5);
  17. -webkit-transform:scale(1.5,1.5);
  18. -ms-transform:scale(1.5,1.5);
  19. }

Bien, ahora, me parece que no es necesario el scale(1,1) inicial, aunque no estoy seguro de esto.
En el ejemplo lo comenté e igual funciona:
http://jsfiddle.net/c2am/SA79Z/12/embedded/result/

Reemplace la imagen por un div, pero debería comportarse de igual manera.

Saludos
__________________
El mundo nada puede contra un hombre que canta en la miseria.
-- Ernesto Sábato--
  #3 (permalink)  
Antiguo 20/03/2016, 13:31
 
Fecha de Ingreso: diciembre-2015
Mensajes: 62
Antigüedad: 8 años, 11 meses
Puntos: 0
Respuesta: Problemas con hover

hola yo no entiendo mucho, pero digo yo, con que solo hubieras puesto al principio

.imagenes{...........

yo creo que te hubiera bastado ya que es una clase y no creo que haga falta que pongas img delante a menos que tengas mas clases que sean imagenes jijijijijijijiij.

pero en principio el codigo parece que esta bien.

Oye C2am, como mola el efecto ese :)

Cita:
usa el highlight
como se usa jijijijijijijijijijijiji, parece interesante

Etiquetas: hover
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 04:34.