zoukankan      html  css  js  c++  java
  • 自制弹出层

    <!--提示框-->
    <div class="layerbigb">
    <div class="uplayerb uplayerbup">
    <div>
    <p class="title">提示</p>
    <p class="titlemsg">请填写此字段</p>
    </div>
    <a class="buynowbutn">确认</a>
    </div>
    </div>
    <div class="layerbigb1">
    <div class="uplayerb1 uplayerbup1">
    <div class="canmay">
    <p class="title1">提示</p>
    <p class="titlemsg1">是否删除?</p>
    </div>
    <div class="doublebtn">
    <a class="canclebtn">取消</a>
    <a class="buynowbutn1">确认</a>
    </div>
    </div>
    </div>
    /*弹出层*/
    .layerbigb{
    100%;
    height: 100%;
    background: rgba(0,0,0,0.3);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999999;
    display: none;
    }
    .uplayerb{
    position: relative;
    6.0rem;
    margin: 0 auto;
    margin-top: 4.5rem;
    background: #fff;
    border-radius: 0.08rem;
    padding: 0 0.24rem;
    text-align: center;
    overflow: hidden;

    }
    .uplayerb div{
    overflow: hidden;
    border-bottom: 1px solid #ccc;
    }


    .uplayerb .title{
    margin-top: 0.25rem;
    font-size: 0.36rem;
    color: #000;
    }
    .uplayerb .titlemsg{
    margin-top: 0.36rem;
    font-size: 0.32rem;
    color: #000;
    margin-bottom: 0.56rem;
    }
    .buynowbutn{
    display: block;
    100%;
    height: 0.80rem;
    line-height:0.80rem;
    font-size: 0.32rem;
    color:#f23030;
    }


    .layerbigb1{
    100%;
    height: 100%;
    background: rgba(0,0,0,0.3);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999999;
    display: none;
    }
    .uplayerb1{
    position: relative;
    6.0rem;
    height:2.9rem;
    margin: 0 auto;
    margin-top: 4.50rem;
    background: #fff;
    border-radius: 0.08rem;
    padding: 0 0.24rem;
    text-align: center;
    overflow: hidden;

    }

    .uplayerb1 .canmay{
    overflow: hidden;
    border-bottom: 0.01rem solid #ccc;
    }


    .uplayerb1 .title1{
    margin-top: 0.25rem;
    font-size: 0.36rem;
    color: #000;
    }
    .uplayerb1 .titlemsg1{
    margin-top: 0.36rem;
    font-size: 0.32rem;
    color: #000;
    margin-bottom: 0.56rem;
    }
    .doublebtn a{
    float:left;
    50%;
    }
    .buynowbutn1{
    height: 0.80rem;
    line-height:0.80rem;
    font-size: 0.32rem;
    color:#f23030;
    }
    .canclebtn{
    height: 0.80rem;
    line-height:0.80rem;
    font-size: 0.32rem;
    color:#f23030;
    border-right: 1px solid #CCCCCC;
    }

    if (company == "" || company == null || company == undefined) {
    $(".layerbigb .titlemsg").text("请输入单位全称");
    $(".layerbigb").css("display", "block");
    return false
    }



  • 相关阅读:
    JavaScript 中document.write() 详细用法介绍
    教你怎么用JavaScript检测当前浏览器是无头浏览器
    JavaScript网页截屏方法,你get到了嘛?
    新手小白该怎么学习前端?附学习路线和资料
    实现微前端需要了解的 Vue Genesis 渲染器
    前端新人关注的Web前端饱和性分析?前端面试必知必会的十点!
    这个前端竟然用动态规划写瀑布流布局?给我打死他!
    Kubernetes之Ingress+Traefik
    MySQL语法大全
    PPTP服务器
  • 原文地址:https://www.cnblogs.com/asylm/p/9002399.html
Copyright © 2011-2022 走看看