点击出现弹框遮罩层

首先写好弹框的页面

<!-- 弹窗 -->
    <div class="index_tan" id="index_tan">
        <div class="in_tan in_kuang hide" id="in_tan">
            <img src="../images/close.png" class="in_close">
            <div class="in_title">请选择您要登录的系统</div>
            <div class="in_button in_button1">系统1</div>
            <div class="in_button in_button2">系统2</div>
        </div>
    </div>

<!-- 弹窗 -->

    <div id="pxxt">点我弹出弹框</div>

接下来是css

/*首页弹窗*/

.index_tan{
    float: left;
    height: 100%;
    width: 100%;
    background: rgba(0,0,0,0.4);
    position: fixed;
    display: none;
    top: 0;
    z-index: 99999;
}
.hide{
    display: none;
}
.in_tan{
  background: url(../images/tan.png) no-repeat;
}
.in