Foros del Web » Creando para Internet » CSS »

Cambiar de posicion una imagen

Estas en el tema de Cambiar de posicion una imagen en el foro de CSS en Foros del Web. pues bien mi problema es el siguiente: Me han encargado un trabajo en clase y es lo siguiente. Tengo que tener una ilera de imagenes ...
  #1 (permalink)  
Antiguo 29/04/2013, 04:01
 
Fecha de Ingreso: abril-2013
Mensajes: 1
Antigüedad: 11 años
Puntos: 0
Cambiar de posicion una imagen

pues bien mi problema es el siguiente: Me han encargado un trabajo en clase y es lo siguiente. Tengo que tener una ilera de imagenes en tamaño pequeños y cuando pase el cursor por encima de una de esas imagenes, esa imagen se tiene que hacer mas grande y a la vez moverse hacia abajo vale os paso mi codigo css en el cual me tengo que basar para hacer el ejercicio.

<html>
<head>
<title>
Paginas
</title>
<style>
img
{width: 200px;}
</style>
</head>
<body>
<img src="blanco y negro.jpg" onmouseover="img.src='lambor.jpg';" onmouseout="img.src='blanco y negro.jpg';"/>
<img src="blanco y negro2.jpg" onmouseover="img.src='ferrari.jpg';" onmouseout="img.src='blanco y negro2.jpg';"/>
<img src="blanco y negro3.jpg" onmouseover="img.src='ferrari2.jpg';" onmouseout="img.src='blanco y negro3.jpg';"/>
</body>
<a></a>
</html>
  #2 (permalink)  
Antiguo 29/04/2013, 06:32
Avatar de Developando  
Fecha de Ingreso: abril-2013
Mensajes: 48
Antigüedad: 11 años
Puntos: 5
Respuesta: Cambiar de posicion una imagen

para eso en CSS existe el :hover, que lo que hace es aplicar el estilo que contenga al elemento, pero únicamente cuando el ratón esté por encima.


img:hover{
width:250px;
}

asi cambiarías el tamaño al pasar el ratón, y también lo mismo si quieres cambiar la posición le indicas la nueva y listo, o le añades algún margin.


Mira ese ejemplo, ahí tienes muchos efectos por si te quieres ganar al profesor

[URL]http://designshack.net/articles/css/joshuajohnson-2/[/URL]

Etiquetas: html, imagenes, posicion, tamaño
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 12:36.