CSS中有多个弹出窗口图层位置

时间:2013-07-10 19:29:02

标签: javascript html css popup

您好我有一个Jquery弹出窗口,它有三层,如下图所示。我正在尝试使window3居中,以便它与window2重叠。出于某种原因,window3作为图像停留在左上角。我尝试了很多不同的方法(填充,边距,z-index,位置..)但无论我做什么,window3都不会居中。也许我错过了一些东西,并希望得到一些其他想法。我没有发布HTML,因为它包含那些带有数据字段的三个windows div标签,这些字段是从下面的Javascript生成的。

enter image description here

function( contentUrl, container, tHeight, tWidth, controller, param ){              

            if( container === "dialog" ){
                var mask = '<div class="mask"></div>';
                var window3 = '<div class="window3"></div>';

                $(mask).appendTo('body');
                $(window3).appendTo('body');

的style.css

 .mask {
        position: fixed;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background: #000000;
        opacity: 0.7;
        z-index: 10;
    }          

 .window1 {
        background: #006666;
        width:430px;
        height:330px;
        opacity: 0.5;        
        padding:10px;
    }

 .window2 {
        background: #fff;              
        width:400px;
        height:300px;
        border-radius:14px;
        margin:10px; 
    }

.window3{   
        position: fixed;
        background: #ffffff;
        margin: auto;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        border-radius:14px;
        z-index: 10;
    }  

1 个答案:

答案 0 :(得分:0)

尝试:

职位:相对;在窗口3上