• 弹出遮罩层


    js代码,控制显示隐藏:

    <script>
            function ShowModal(eid) {
                $(".modal").show();
                $(".modal-content").show();
            }
            $(function () {
                // modal事件
                var $modal = $('.modal');
                $modal.on('click', function (ev) {
                    var $this = $(this);
                    $this.hide();
                    $(".modal-content").hide();
                });
            });
        </script>

    css代码:

    .modal {
                position: fixed;
                top: 0;
                right: 0;
                bottom: 0;
                left: 0;
                z-index: 10;
                padding-right: 0.733333rem;
                padding-left: 0.733333rem;
                display: none;
                background-color: #919191;
                z-index: 99;
                opacity: 0.5;
            }
    
            .modal-content {
                position: fixed;
                top: 0;
                bottom: 0;
                left: 0;
                right: 0;
                margin: auto;
                 65rem;
                height: 50rem;
                padding: 0.706667rem 0.533333rem 0.666667rem;
                text-align: center;
                background-color: #cffaff;
                border-radius: 0.266667rem;
                resize: both;
            }

    html代码:

    <div class="modal"></div>
        <div class="modal-content" style="z-index: 99; display: none;">
            test
        </div>
  • 相关阅读:
    打印日志宏定义
    数据库读写操作
    SQL语句组成
    MySQL数据库的使用
    ubuntu下解决MySQL 1045 error
    css样式优先级
    redis
    dubbo
    maven
    Mybatis笔记
  • 原文地址:https://www.cnblogs.com/xsj1989/p/5242543.html
Copyright © 2020-2023  润新知