Ayuda con ventana

alparkom · #1 (**permalink**) 25/01/2010, 13:48

Miren mi pregunta es la siguiente:

Como se puede hacer que al entrar a la pagina y aparesca una ventana encima de todas las otras cosas que estan en la pagina y que la pagina de fondo o sea la que esta abajo se ponga mas oscura, asi como la de www.directoriow.com
algo asi

porfavor

chaooooooooo

alor86 · #2 (**permalink**) 26/01/2010, 00:01

prueba con esto

Código HTML:

Ver original<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 
    <head>
        <script type="text/javascript">
            window.onload = function(){
                var cl = document.getElementById('cl');
                cl.onclick = function(){
                        var fondo = document.getElementById('superior');
                        var ventana = document.getElementById('ventana');
                        document.getElementsByTagName('body')[0].removeChild(fondo);
                        document.getElementsByTagName('body')[0].removeChild(ventana);
                }               
            }
        </script>
         <style type="text/css">
                div.cont{
                    width: 700px;
                    height: 600px;
                    border: solid 1px black;
                    background: yellow;
                    margin: 10px auto 10px auto;
                }
                #superior{
                    position: absolute;
                    z-index: 1000;
                    background: #000;
                    filter:alpha(opacity='70');
                    opacity:0.7;
                    width: 100%;
                    height: 100%;
                    top: 0;
                    left: 0;
                }
                #ventana{
                    position: absolute;
                    width: 400px;
                    height: 400px;
                    top: 30%;
                    left: 30%;
                    z-index: 1001;
                    background: #fff;
                    
                }
                div.titulo{
                    height: 30px;
                    background: #8800ff;
                    text-align: right;
                }
                div.titulo span{
                    cursor: pointer;
                }
         </style>
         
    </head>
    
    <body>
        <div id="superior">
            
        </div>
        <div id="ventana">
            <div class="titulo">
                <span id="cl">X &nbsp;</span>
            </div>          
        </div>
        <div id="contenido" class="cont">
            
        </div>   
    </body>
</html>

alparkom · #3 (**permalink**) 27/01/2010, 16:02

no me sirvio amigo
gracias de todos modos

alor86 · #4 (**permalink**) 27/01/2010, 17:28

que es lo que no te funciono? , el ejemplo no hace lo que necesitas?

alparkom · #5 (**permalink**) 28/01/2010, 17:32

tu ejemplo hace que cuando aprete la cruz se cierre (correcto) pero el fondo no es de un tono medio transparente oscuro, eso no me funciono