Foros del Web » Creando para Internet » CSS »

hover con imagen

Estas en el tema de hover con imagen en el foro de CSS en Foros del Web. Hola, que tal? Estoy tratando de hacer un boton con una imagen dentro de un div con css, para que cuando el puntero del mouse ...
  #1 (permalink)  
Antiguo 18/08/2011, 14:55
Avatar de morfasto  
Fecha de Ingreso: julio-2011
Ubicación: Lima
Mensajes: 291
Antigüedad: 5 años, 4 meses
Puntos: 8
hover con imagen

Hola, que tal?

Estoy tratando de hacer un boton con una imagen dentro de un div con css, para que cuando el puntero del mouse este encima, se cambie a otra imagen con hover. Como hago?

Gracias!
  #2 (permalink)  
Antiguo 18/08/2011, 15:28
Avatar de Heiroon  
Fecha de Ingreso: junio-2010
Ubicación: Caracas, Venezuela - Por ahora...
Mensajes: 489
Antigüedad: 6 años, 6 meses
Puntos: 63
De acuerdo Respuesta: hover con imagen

Buenas mi pana, te voy a dejar un ejemplo bien sencillo para ver si te ayudo.

Código CSS:
Ver original
  1. .clase_del_div
  2. {
  3.    background-image: url(imgInactiva.png);
  4.    /*otros atributos css */
  5. }
  6.  
  7. .clase_del_div:hover
  8. {
  9.    background-image: url(imgActiva.png);
  10. }

Espero te sirva de ayuda. Salutacions!
  #3 (permalink)  
Antiguo 18/08/2011, 15:36
Avatar de morfasto  
Fecha de Ingreso: julio-2011
Ubicación: Lima
Mensajes: 291
Antigüedad: 5 años, 4 meses
Puntos: 8
Respuesta: hover con imagen

Funciona perfecto, GRACIAS!
  #4 (permalink)  
Antiguo 19/08/2011, 09:04
Avatar de Hazuki  
Fecha de Ingreso: mayo-2011
Mensajes: 34
Antigüedad: 5 años, 6 meses
Puntos: 7
Respuesta: hover con imagen

Una técnica muy utilizada es la de los sprites: juntas varias imágenes en una sola y mediante un "truco" seleccionas la que quieras usar. Así utilizas menos archivos y le ahorras un poco de trabajo a los navegadores.

Un buen tutorial lo encuentras en:
http://www.w3schools.com/css/css_image_sprites.asp

Saludos.

Última edición por Hazuki; 19/08/2011 a las 09:07 Razón: El editor no me deja dar formato a una URL -.-

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 23:47.