自定义弹窗提示2

 

效果图

 

    <!--弹出窗-->
    <div id="popup">
        <div class="popup_cont">
            <div class="title" style="height: 40px; background-color: #32aadf;">
                <span style="font-size: 16px; color: white; display: inline-block; float: left; margin: 10px 10px 10px 10px;">
                    选择仓库</span>
                <img id="img_close" data-text="close" data-operation="nothing" src="Main/images/关闭.png"
                    style="cursor: pointer; float: right; margin: 3px 10px 10px 10px; vertical-align: top;" />
            </div>
            <div class="content" id="prompt_content" style="font-size: 16px; text-align: center;
                padding: 50px 10px;">
                <select id="sel_SBSTORE">
                    <option value="value">中心仓库</option>
                    <option value="value">中心仓库</option>
                </select>
            </div>
            <div class="operation" style="height: 40px; background-color: #cbcbcc; text-align: center;
                vertical-align: middle">
                <input class="confirm" id="popup_confirm" data-text="confirm" data-val="0" data-operation="nothing"
                    type="button" style="margin: 5px 10px; border-radius: 5px; padding: 3px 15px;
                    color: white; background-color: #289fd2; font-size: 16px; border: 0px solid #00A1E0;
                    cursor: pointer;" value="确定" />
            </div>
        </div>
    </div>

 

<style type="text/css">
        #popup
        {
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.6);
            opacity: 1;
            position: fixed;
            left: 0px;
            top: 0px;
            display: none;
            z-index: 100;
        }
        
        #popup .popup_cont
        {
            background: rgba(255, 255, 255, 0) none repeat scroll 0 0;
            background-color: white;
            height: 200px;
            width: 400px;
            margin: auto;
            position: absolute;
            top: 0;
            left: 0;
            bottom: 0;
            right: 0;
        }
    </style>

 

  //弹出
        $("#popup").show();

        //关闭
        $("#popup").hide();

 

posted @ 2017-04-27 11:28  妖狐鬼魅  阅读(188)  评论(0编辑  收藏  举报