emergente modal arriba como Google

Cómo hacer emergente modal como Gmail (cuando tratamos de subir exe el pop-up que genera cubre barra de desplazamiento de la página)emergente modal arriba como Google

Fuente

2010-06-18 Niraj Choubey

Salida los siguientes plugins de diálogo modales para jQuery:

Fuente

2010-06-18 11:46:46

Tome un vistazo a la modal option in jQuery UI Dialog o la función JavaScript alert() si solo necesita un diálogo de texto simple.

Fuente

2010-06-18 11:41:00 gnarf

GMail se ejecuta en iframe y la superposición div no está dentro de este iframe, por lo que permanece en la parte superior del iframe en consecuencia en la parte superior de la barra de desplazamiento.

Código de Gmail

html, body { 
    height:100%; 
    margin:0; 
    overflow:hidden; /* no scrollbars (only in the iframe) */ 
    width:100%; 
} 

.cO { /* this is the iframe */ 
    height:100%; 
    width:100%; 
} 

.Kj-JD { 
    background-color:#C3D9FF; 
    border:1px solid #4E5766; 
    color:#000000; 
    outline:0 none; 
    padding:5px; 
    position:absolute; 
    top:0; 
    width:450px; 
    z-index:501; /* div stays on top */ 
} 

.Kj-JD-Jh { /* the shadow */ 
    background-color:#808080; 
    left:0; 
    position:absolute; 
    top:0; 
    z-index:500; 
}

HTML de ejemplo

<body> 
    <iframe class="cO">...</iframe> <!-- the scroll works on the iframe, not the body --> 
    <div class="Kj-JD"></div> <!-- outside the iframe --> 
    <div class="Kj-JD-Jh" style="opacity: 0.5; width: 1440px; height: 361px;"></div> <!-- black background --> 
</body>

Para mostrar un div en la parte superior recomiendo jqModal, lo hace todo el trabajo duro para usted.

Fuente

2010-06-18 11:43:09 BrunoLM

me puede mostrar un ejemplo de lo que dijo. –

Agregué una parte del código de Gmail, el cuerpo no tiene un rollo, pero el iframe sí y el div no está dentro del iframe, lo que significa que puede colocarse encima de cualquier cosa dentro del cuerpo, por lo tanto encima de las barras de desplazamiento. – BrunoLM

Muchas gracias BrunoLM –

Eche un vistazo a la opción modal en el cuadro de diálogo de la interfaz de usuario de jQuery o la función de alerta de JavaScript() si solo necesita un cuadro de diálogo de texto simple.

Fuente

2010-08-02 12:08:56

emergente modal arriba como Google

Respuesta

Cuestiones relacionadas