Geek Answers Handbook

Modal popup like google

How to make a modal popup such as gmail (when trying to load exe popup that generates a scroll bar)

+5
source share
4 answers

Check out the following modal dialog plugins for jQuery:

+1
source

GMail works on iframe, and the overlay is divnot inside this iframe, so it stays on top of the iframe, therefore, on top of the scrollbar.

Code from 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 example

<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>

div , jqModal, .

+7

Take a look at the modal option in the jQuery UI Dialog dialog box or the JavaScript alert () function if you only need a simple text dialog.

+1
source

Take a look at the modal option in the jQuery interface dialog box or in JavaScript alert()if you only need a simple text dialog.

0
source

More articles:


All Articles