Foros del Web » Creando para Internet » CSS »

transparencia en un div emergente

Estas en el tema de transparencia en un div emergente en el foro de CSS en Foros del Web. Hola, gente linda! Abro este nuevo tema porque por algún motivo desapareció el original. No me queda más remedio que abrir uno nuevo con mi ...
  #1 (permalink)  
Antiguo 19/04/2009, 22:44
Avatar de pabloe9k  
Fecha de Ingreso: julio-2008
Ubicación: Argentina
Mensajes: 190
Antigüedad: 9 años, 5 meses
Puntos: 3
Pregunta transparencia en un div emergente

Hola, gente linda!
Abro este nuevo tema porque por algún motivo desapareció el original. No me queda más remedio que abrir uno nuevo con mi última consulta al respecto.

Panino5001 me dio una mano enorme con este código, pero me quedó una última duda que no puedo resolver.

Me pasaron este código, con el cual me aparecen en pantalla dos cuadros amarillos con un pequeño texto, uno de ellos transparentes y el otro no:

Código HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Documento sin t&iacute;tulo</title>
<script>
function set_opacity(div, val) {
            div.style.opacity = val;
            div.style.MozOpacity = val;
            div.style.KhtmlOpacity = val;
            div.style.filter = 'alpha(opacity=' + val*100 + ')';
            div.style.zoom=1;
}
onload=function(){set_opacity(document.getElementById('miDiv1'),.5);}
//.5 o el valor de opacidad que necesites de 0 a 1}
</script>
</head>

<body>
<div id="miDiv2" style="border:medium solid; width:150px; height:123px; position:absolute; top:0; left:130px; background-color:yellow;">Sin Opacidad</div>
<div id="miDiv1" style="border:medium solid; width:150px; height:123px; position:absolute; top:222px; left:130px; background-color:yellow;"></div><div style="position:absolute; top:224px; left:134px;">Con Opacidad</div>
</body> 
Ahora, quise agregar nuevamente la misma función (con otro nombre) para que los dos cuadros 'miDiv1' y 'miDiv2' sean transparentes, pero no funciona. Sólo en uno lo hace.

Este código usé:

Código HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Documento sin t&iacute;tulo</title>

<script>
function set_opacity(div, val) {
            div.style.opacity = val;
            div.style.MozOpacity = val;
            div.style.KhtmlOpacity = val;
            div.style.filter = 'alpha(opacity=' + val*100 + ')';
            div.style.zoom=1;
}
onload=function(){set_opacity(document.getElementById('miDiv1'),.5);}
//.5 o el valor de opacidad que necesites de 0 a 1}
</script>

<script>
function set_opacity2(div, val) {
            div.style.opacity = val;
            div.style.MozOpacity = val;
            div.style.KhtmlOpacity = val;
            div.style.filter = 'alpha(opacity=' + val*100 + ')';
            div.style.zoom=1;
}
onload=function(){set_opacity(document.getElementById('miDiv2'),.5);}
//.5 o el valor de opacidad que necesites de 0 a 1}
</script>
</head>

<body>

<div id="miDiv2" style="border:medium solid; width:150px; height:123px; position:absolute; top:0; left:130px; background-color:yellow;">Opacidad</div>

<div id="miDiv1" style="border:medium solid; width:150px; height:123px; position:absolute; top:222px; left:130px; background-color:yellow;">Opacidad</div>

</body> 

A alguien se le ocurre por qué no está funcionando el código?

Muchas gracias, de antemano.


Saludos.
  #2 (permalink)  
Antiguo 20/04/2009, 04:07
Avatar de ZiTAL  
Fecha de Ingreso: marzo-2004
Ubicación: Bermio (Bizkaia)
Mensajes: 1.545
Antigüedad: 13 años, 9 meses
Puntos: 62
Respuesta: transparencia en un div emergente

Aupa, para empezar no se que tiene que ver esto con ajax pero bueno.

No tienes porque duplicar código ya que puedes utilizar la misma para hacer ambas cosas:

Código javascript:
Ver original
  1. onload=function()
  2. {
  3. set_opacity(document.getElementById('miDiv1'),.5);
  4. set_opacity(document.getElementById('miDiv2'),.5);
  5. }

borra las funciones duplicadas y pon esto en el primer onload, el segundo borralo.
__________________
http://zital.no-ip.org
____________________

Euskerie ahuen eta bijotzan
  #3 (permalink)  
Antiguo 20/04/2009, 08:07
Avatar de pabloe9k  
Fecha de Ingreso: julio-2008
Ubicación: Argentina
Mensajes: 190
Antigüedad: 9 años, 5 meses
Puntos: 3
Respuesta: transparencia en un div emergente

Cita:
Iniciado por ZiTAL Ver Mensaje
Aupa, para empezar no se que tiene que ver esto con ajax pero bueno.

No tienes porque duplicar código ya que puedes utilizar la misma para hacer ambas cosas:

Código javascript:
Ver original
  1. onload=function()
  2. {
  3. set_opacity(document.getElementById('miDiv1'),.5);
  4. set_opacity(document.getElementById('miDiv2'),.5);
  5. }

borra las funciones duplicadas y pon esto en el primer onload, el segundo borralo.

Muchas gracias!
Lo voy a probar esta misma noche.

Y, por si te interesa saber, la consulta apuntaba por el lado de AJAX porque cuando hago click en un link, mediante ajax, se despliega un formulario con datos obtenidos de una consulta a la base de datos que se hace mediante AJAX, sin refrescar la ventana, en una nueva capa. Y yo buscaba que esa nueva capa sea transparente.
Sólo eso.
Je.

Gracias nuevamente.
Saludos!
  #4 (permalink)  
Antiguo 20/04/2009, 09:51
Avatar de GatorV
$this->role('moderador');
 
Fecha de Ingreso: mayo-2006
Ubicación: /home/ams/
Mensajes: 38.567
Antigüedad: 11 años, 6 meses
Puntos: 2122
Respuesta: transparencia en un div emergente

Tema trasladado desde AJAX
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 06:38.