5
Come rendere popup modale come Gmail (quando cerchiamo di caricare exe il pop up che genera copre barra di scorrimento della pagina)modale pop up come google
A
risposta
1
Scopri i seguenti plugin di dialogo modale per jQuery:
0
Date un'occhiata al modal option in jQuery UI Dialog o la funzione JavaScript alert() se serve solo una semplice finestra di testo.
7
GMail gira su un iframe e l'overlay div non si trova all'interno di questo iframe, quindi rimane sopra l'iframe di conseguenza in cima alla barra di scorrimento.
Codice da 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 di esempio
<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>
Per mostrare un div in cima raccomando jqModal, si fa tutto il lavoro duro per voi.
1
Dai un'occhiata all'opzione modale in jQuery UI Dialog o JavaScript alert() se hai bisogno solo di una semplice finestra di dialogo.
Problemi correlati
- 1. Pop-up modale in vista griglia in yii2
- 2. pop-up di aggiornamento dell'ultimo Java pop-up
- 3. javadoc Eclipse pop-up
- 4. javascript finestra pop-up
- 5. Applicazione pop up
- 6. Openning a Modal Pop-up finestra
- 7. Come utilizzare Modal Pop up con Material Design Lite?
- 8. Finestra pop-up in Java Swing
- 9. Come pop-up della tastiera Android "? 123"
- 10. iphone: Pop up pulsante nella UIWebView
- 11. Pop-up Android con testa a freccia
- 12. Menu popup pop-up con margine
- 13. Larghezza pop-up bootstrap per popover-inner
- 14. messaggio pop-up riuscito/fallito dopo l'invio?
- 15. Rstudio Git bash pop-up ogni volta
- 16. Pop Immagini come Google Immagini
- 17. Come mostrare un messaggio pop-up come in StackOverflow
- 18. Come si aprono i collegamenti di Google Maps in una finestra pop-up?
- 19. Come creare una vista pop-up personalizzata con swift?
- 20. Come chiamare o pop-up frammento al clic del pulsante
- 21. Come ottenere il completamento automatico di jQuery su pop-up?
- 22. Come gestire pop-up in selenio WebDriver utilizzando Java
- 23. come ottenere input da una finestra pop-up
- 24. Come mostrare un avviso pop-up nel cacao?
- 25. Come a pop-up nuova finestra con il tasto Tweet
- 26. Come ottenere la larghezza effettiva di un pop-up WPF
- 27. Come creare un modulo in un pop-up usando xamarin.forms?
- 28. Come integrare banner iAd o Admob come pop-up (non a schermo intero) ma visualizzato come pop-up al centro dello schermo in Applicazione?
- 29. bar pop-up sulla voce di elenco selezionata
- 30. Disabilita notifiche/pop-up Gnome 3/notifiche integrate
puoi mostrarmi un esempio su quello che hai detto. –
Ho aggiunto una parte del codice Gmail, il corpo non ha una scroll, ma l'iframe lo fa, e il div non è all'interno dell'iframe, il che significa che può essere posizionato sopra qualsiasi cosa all'interno del corpo, di conseguenza in cima le barre di scorrimento. – BrunoLM
Grazie mille BrunoLM –