在背景叠加层上显示div

时间:2015-04-27 15:45:27

标签: html css

我有一个背景的CSS代码,它作为我的HTML内容之上的叠加层:

#ticket{
        display: block;
        position: relative;
    }

    #ticket:before {
        position: absolute;
        display: block;
        background:rgba(137,137,137,0.7);
        content: "";
        top:0;
        left:0;
        right: 0;
        bottom: 0;
        z-index:9999;
    }

如何在叠加层顶部显示div JQueryPopup div?

https://jsfiddle.net/gun82rgy/1/

1 个答案:

答案 0 :(得分:1)

只需在z-index中设置以上值即可。 z-index属性指定元素的堆栈顺序。

.JQueryPopup {
    position: fixed;
    left: 50%;
    top:25%;
    -ms-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 600px;
    min-height: 80px;
    padding: 15px;
    background-color: #FFFFFF;
    border: 2px solid #F36F25;
    z-index: 99999; //See here
    box-shadow: #000000 0 2px 18px;
}

<强> DEMO HERE