Foros del Web » Creando para Internet » CSS »

Oscurecer y bloquear un div

Estas en el tema de Oscurecer y bloquear un div en el foro de CSS en Foros del Web. Buenos dias, tengo un div que necesito que aparezca sombreado o con algo de opacidad y bloqueado pra que no se pueda clickar en el ...
  #1 (permalink)  
Antiguo 01/07/2013, 04:52
 
Fecha de Ingreso: noviembre-2010
Mensajes: 146
Antigüedad: 13 años, 3 meses
Puntos: 3
Oscurecer y bloquear un div

Buenos dias, tengo un div que necesito que aparezca sombreado o con algo de opacidad y bloqueado pra que no se pueda clickar en el hasta que se seleccione una opcion anterior.

Hasta ahora lo tengo hecho con display:none para que no se vea, pero necesito que si que se vea pero algo sombreado.


Alguien me puede echar una mano?

Gracias
  #2 (permalink)  
Antiguo 01/07/2013, 05:07
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.488
Antigüedad: 21 años, 7 meses
Puntos: 2114
Respuesta: Oscurecer y bloquear un div

Normalmente si haces click sobre un div no ocurre nada. Así que la parte de no se pueda clickar no la entiendo. Así que tal vez esa parte debas de solucionarla con JavaScript si necesitas que sea interactivo.

Para la opacidad, puedes usar rgba() o hsla():

Código CSS:
Ver original
  1. div {
  2.   background-color: rgba(0,0,0,0.5);
  3. }

Lo que sospecho es que quieras usar algún tipo de lightbox, ¿tal vez?
  #3 (permalink)  
Antiguo 01/07/2013, 05:54
 
Fecha de Ingreso: noviembre-2010
Mensajes: 146
Antigüedad: 13 años, 3 meses
Puntos: 3
Respuesta: Oscurecer y bloquear un div

Me refiero a que dentro del div hay campos de formulario y algunas cosas mas, y quiero que este como bloqueado que no se pueda hacer nada en el hasta desbloquearlo.
  #4 (permalink)  
Antiguo 01/07/2013, 05:58
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.488
Antigüedad: 21 años, 7 meses
Puntos: 2114
Respuesta: Oscurecer y bloquear un div

Eso ya es cuestión de HTML. Para eso existe el atributo disabled.

Y de nuevo, tendrás que usar JavaScript para alterar esos atributos.
  #5 (permalink)  
Antiguo 01/07/2013, 06:03
 
Fecha de Ingreso: noviembre-2010
Mensajes: 146
Antigüedad: 13 años, 3 meses
Puntos: 3
Respuesta: Oscurecer y bloquear un div

si si lo de javascript ya lo tengo claro de hecho ya tengo funcionando con ello lo del display.

Probare con el disabled.

Gracias
  #6 (permalink)  
Antiguo 02/07/2013, 01:35
 
Fecha de Ingreso: noviembre-2010
Mensajes: 146
Antigüedad: 13 años, 3 meses
Puntos: 3
Respuesta: Oscurecer y bloquear un div

Pero este atributo es solo para los campo de formulario, no existe algo que pueda aplicar a un div entero y me lo oscurezca un poco y no deje interactuar cn su interior??
  #7 (permalink)  
Antiguo 02/07/2013, 02:02
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.488
Antigüedad: 21 años, 7 meses
Puntos: 2114
Respuesta: Oscurecer y bloquear un div

Si es un atributo para campos de un formulario.

No existe nada definido para hacer lo que quieres. Se podría conseguir añadiendo un pseudo-elemento que cubra ese área y se superponga.

Código CSS:
Ver original
  1. div {
  2.   position: relative;
  3. }
  4.  
  5. div:after {
  6.   position: absolute;
  7.   top: 0;
  8.   right: 0;
  9.   bottom: 0;
  10.   left: 0;
  11.   content: ' ';
  12.   background-color: rgba(0,0,0,.5);
  13. }

Con eso debería de funcionar. Puedes añadirle un z-index, aunque en principio no haría falta.

Etiquetas: bloquear, oscurecer
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:24.