Color de la página en negro al abirir ventanita

[Geze]

Vamonos directo al asunto:
Tengo una ventanita que se abre en la misma página en javascript, utilizando getElemetByID() y objeto.style.estilo para abirir y cerrar, el problema ahora es que quiero hacer que al abrise esta ventanita (que repito, ya le hice) el fondo del resto, o sea, lo que no es la ventanita se haga oscuro, para que me entiendan un poco mejor, algo como lo que se muestra aquí:
http://www.artviper.net/website-tools/bumpbox-lightbox.php
Espero su ayuda pronto, muchas gracias por todo n_n Adiós.

[salbatore]

Hola Geze,

Pues no me parece muy dificil, jojo solo por eso te ayudo que no tengo mucha idea, jojo... mira los pasos:

1-Creas una imagen png con transparencia de 10px por 10x o lo que quieras, sera el color del objeto, ya que como no quieres hacer ningun fade ni aparicion fantasmal pues mejor, pues opacity no esta en todos los navegadores. Y la transparencia de png si lo esta en todos, menos con IE6, pero hay varios trucos para esquivar ese problema, como este css:

Código CSS:

background-image: url(”negro_transparente.png”)!important;
 background-image: none;
 filter: none !important;
 filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=’negro_transparente.png’);
 

Es por no usar opacity aunque si quieres usar opacity usa(esta guapo):

Código CSS:

.opaco {background: black;filter: alpha(opacity=50); opacity: .5}
 

2-Creas el elemento html de negro:

Código HTML:

<div id="telon_negro"  onclick="_empezar_la_funcion()" style="background:url(negro_transparente.png); position:absolute; width:
100%; height:100%; z-index:100000"></div>
 

3-Pon este script en el head, tiene un retardo, pues cuando la web se abre rapidamente no se percibe que lo que es negro es un telon y no la web... ya me entiendes... jojo:

Código HTML:

<script>
window.onload = function()
    {
        //retardo para ver la web sin el telon al cargar y que aparezca pasado unos milisegundos...
        setTimeout(function(){_que_el_publico_se_siente()}, 1000);
        
    }
function _que_el_publico_se_siente()
    {
        document.getElementById('telon_negro').style.display='inherit'; 
    }
function _empezar_la_funcion()
    {
        document.getElementById('telon_negro').style.display='none';    
    }
</script>
 

4-Y para quitar el telon negro para que empiece la funcion solo tienes clicar en el telon negro.

Bueno eso... la verdad es que parece increible hacer un post tan largo para cosa como esta... pero que le voy hacer soy asi, jojo.

Espero que te sirva de algo.

[Geze]

Gracias, no lo he provado; espero que funcione, ah y por cierto, la página en lo que implementaré esto no permite entrar con IExplorer :D pero aún así, gracias.