Foros del Web » Creando para Internet » CSS »

Cambiar color de fondo con CSS y :hover

Estas en el tema de Cambiar color de fondo con CSS y :hover en el foro de CSS en Foros del Web. Saludos, ¿Es posible esto? Necesito que al pasar el ratón sobre un link cambie el fondo de la página. Cada link pondrá de fondo un ...
  #1 (permalink)  
Antiguo 28/03/2011, 04:31
 
Fecha de Ingreso: octubre-2008
Mensajes: 93
Antigüedad: 16 años, 1 mes
Puntos: 1
Cambiar color de fondo con CSS y :hover

Saludos,

¿Es posible esto?

Necesito que al pasar el ratón sobre un link cambie el fondo de la página. Cada link pondrá de fondo un color diferente.

Por ejemplo,
Código CSS:
Ver original
  1. #twitter:hover {background: blue;}

Esto, evidentemente, me cambia el fondo del div con la id de twitter. Pero lo que yo deseo es cambiar el fondo de body o otro div cuando el usuario pase el ratón por encima.

¿Es posible hacer esto solo con CSS? Aunque sea CCS3...

¡Muchas gracias!
  #2 (permalink)  
Antiguo 28/03/2011, 05:23
Avatar de IsaBelM
Colaborador
 
Fecha de Ingreso: junio-2008
Mensajes: 5.032
Antigüedad: 16 años, 5 meses
Puntos: 1012
Respuesta: Cambiar color de fondo con CSS y :hover

revisa este post. también lo puedes hacer con javascript. en tal caso funcionaría en todos los navegadores
  #3 (permalink)  
Antiguo 28/03/2011, 05:28
 
Fecha de Ingreso: octubre-2008
Mensajes: 93
Antigüedad: 16 años, 1 mes
Puntos: 1
Respuesta: Cambiar color de fondo con CSS y :hover

Cita:
Iniciado por IsaBelM Ver Mensaje
revisa este post. también lo puedes hacer con javascript. en tal caso funcionaría en todos los navegadores
Pero esto no me sirve...

Con Javascript y jQuery ya lo tengo hecho. Lo que quiero es saber si con selectores de css puedo llegar a conseguir el mismo efecto.

¿Como puedo cambiar el fondo de BODY al pasar el ratón sobre un link? Yo creo que no se puede hacer sin utilizar javascript...

¿Algún iluminado?

Muchas gracias.
  #4 (permalink)  
Antiguo 28/03/2011, 05:36
Avatar de IsaBelM
Colaborador
 
Fecha de Ingreso: junio-2008
Mensajes: 5.032
Antigüedad: 16 años, 5 meses
Puntos: 1012
Respuesta: Cambiar color de fondo con CSS y :hover

creo que no has revido el la liga que te proporcioné, si no tu respuesta no habría sido únicamente enfocada a javascript
  #5 (permalink)  
Antiguo 28/03/2011, 05:52
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 17 años, 5 meses
Puntos: 539
Respuesta: Cambiar color de fondo con CSS y :hover

Debería publicar el marcado html.
Quizás se pueda o quizás no, todo depende de la estructura (código) html, ya que css no define selectores de ancestros, peo vía html (y las declaraciones css) se pueden simular.
  #6 (permalink)  
Antiguo 28/03/2011, 10:22
 
Fecha de Ingreso: enero-2011
Ubicación: Colombia
Mensajes: 6
Antigüedad: 13 años, 10 meses
Puntos: 1
Respuesta: Cambiar color de fondo con CSS y :hover

Recomiendo usar jquery
  #7 (permalink)  
Antiguo 28/03/2011, 10:34
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 17 años, 5 meses
Puntos: 539
Respuesta: Cambiar color de fondo con CSS y :hover

Más fanboys de las librerías.

En este ejemplo, a ver quien encuentra el javaescript que hace al hipnosapo 100% de la ventana al :hover sobre el input submit
  #8 (permalink)  
Antiguo 28/03/2011, 15:33
Avatar de IsaBelM
Colaborador
 
Fecha de Ingreso: junio-2008
Mensajes: 5.032
Antigüedad: 16 años, 5 meses
Puntos: 1012
Respuesta: Cambiar color de fondo con CSS y :hover

Cita:
Iniciado por kseso? Ver Mensaje
En este ejemplo, a ver quien encuentra el javaescript que hace al hipnosapo 100% de la ventana al :hover sobre el input submit
nadie puede encontrar js en ese código puesto que estas usando selector de hermano adyacente. que por otro lado es la primera opción que dí, solo que en lugar de adyacente use descendente. para el caso es lo mismo, al menos ie8, no acepta ni adyacentes, descendentes ni hijos. que si no recuerdo mal, es la razón por la que le di la opción de usar javascript
  #9 (permalink)  
Antiguo 29/03/2011, 06:21
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 17 años, 5 meses
Puntos: 539
Respuesta: Cambiar color de fondo con CSS y :hover

Maticemos, Isabel, y aclaremos conceptos:
Mi primera intervención fue en #5, después de que el consultante indicase claramente que buscaba (y las razones no me interesan) una solucción con puro css para pedirle más precisión y el marcado html que utiliza.
La segunda en #7, con un ejemplo que puede ser o no ser válido para la consulta actual, fue en respuesta y para rebatir el #6.
Sobre sus palabras, creo obligado hacer unas precisiones para evitar que futuros lectores de ellas se llamen a engaño:
Cita:
Iniciado por IsaBelM Ver Mensaje
nadie puede encontrar js en ese código puesto que estas usando selector de hermano adyacente. que por otro lado es la primera opción que dí <-- falso, lo reconoce a continuación -->, solo que en lugar de adyacente use descendente. para el caso es lo mismo<-- son totalmente diferentes, incluso en el arbol: unos se encuentran en niveles más profundos y otros a igual nivel, al menos ie8, no acepta ni adyacentes<-- erróneo, descendentes<--erróneo ni hijos<-- erróneo. Soporta los tres selectores sin problemas. que si no recuerdo mal, es la razón por la que le di la opción de usar javascript
En el ejemplo que puse en #7, ie8 hace el cambio de imagen sin problemas, lo que no hace es aumentar el tamaño, porque está basado en /transform: scale();/
Pero para ello hay otras propiedades sí soportadas por la familia de ie que podrían utilizarse.
  #10 (permalink)  
Antiguo 29/03/2011, 13:44
Avatar de IsaBelM
Colaborador
 
Fecha de Ingreso: junio-2008
Mensajes: 5.032
Antigüedad: 16 años, 5 meses
Puntos: 1012
Respuesta: Cambiar color de fondo con CSS y :hover

La segunda en #7, con un ejemplo que puede ser o no ser válido para la consulta actual, fue en respuesta y para rebatir el #6.
ya había algún precedente, por ello pensé que yo también estaba incluida

acerca de las "precisiones". si particionas el texto como mas te convenga, pues seguro que puedes matizar cada palabra.
  • 1ª precisión: no hay contradicción, cuando dije "es la primera opción que dí" me refería a usar css. no a que el selector fuera adyacente, descendiente o hijo.
  • 2ª precisión: de nuevo has vuelto a interpretarme mal. lo único que pretendí, y por lo visto no logré expresar, es que no he logrado que esos selectores funcionen en ie8. ahora acabo de probarlos en otra maquina que también tiene ie8 y en esta funcionan. no comprendo a que puede deberse.
  • 3ª y siguientes precisiones: me remito a lo ya dicho anteriormente.
  #11 (permalink)  
Antiguo 29/03/2011, 14:07
Avatar de ZoroRoronoa  
Fecha de Ingreso: marzo-2011
Ubicación: California, USA
Mensajes: 824
Antigüedad: 13 años, 7 meses
Puntos: 116
Respuesta: Cambiar color de fondo con CSS y :hover

Yo creo que es mejor javascript ya que no daria ningun inconveniente en algun navegador, mientras que el CSS, debido a unas propiedades, podrian no visualizarse en algunos navegadores como IE 6 y 7.
__________________
Programador jQuery & PHP
  #12 (permalink)  
Antiguo 03/04/2011, 02:30
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 22 años, 4 meses
Puntos: 361
Respuesta: Cambiar color de fondo con CSS y :hover

Hola:

Cita:
Iniciado por ZoroRoronoa Ver Mensaje
Yo creo que es mejor javascript ya que no daria ningun inconveniente en algun navegador
Salvo que el usuario, por los motivos que fuera, tuviera desactivado javascript en su navegador con lo cual el efecto no funcionaría.

Saludos.


Etiquetas: color, fondo, 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 08:18.