">
美文网首页
点击展示弹窗

点击展示弹窗

作者: W木槿暖夏 | 来源:发表于2018-12-24 10:51 被阅读0次

弹窗两秒后消失

   .Submit {
        border-radius: 5px;
        background: #80c342;
        color: #fff;
        margin-left: 50%;
    }

    .pop_up {
        display: none;
        width: 150px;
        height: 50px;
        border: 1px solid #808080;
        text-align: center;
        line-height: 50px;
        border-radius: 5px;
        font-size: 16px;
        background: #79f00a;
        opacity: 0.6;
        filter: alpha(opacity=40);
        color: #fff;
        position: fixed;
        top: 14%;
        right: 45%;
        text-align: center;

    }
  <button class="Submit">提交</button>
    <div class="pop_up">
        操作成功
    </div>
引入jquery
<script src="./jquery-2.1.0.js"></script>
 $('.Submit').click(function () {
        $(".pop_up").show();
        setTimeout(function () {
            $(".pop_up").delay(2000).hide(0);
            location.href = "http://baidu.com";
        }, 1000);

    })

相关文章

  • 点击展示弹窗

    弹窗两秒后消失 引入jquery

  • 一些异常及后续规避

    需求:用户点击图标可展示弹窗,弹窗内容是从服务端获取的问题场景:网络极差,用户展开弹窗,在未获取到信息之前,用户即...

  • Android弹窗窗体泄露问题

    在Android中使用弹窗,通过弹窗进入下一界面,如果某个需求是在下一界面点击返回时直接退出APP,此时在弹窗展示...

  • 自定义vue组件

    (1) 自定义组件dialog.vue (2) 页面调用 (3) 弹窗效果展示 拓展:vue自定义组件点击页面其他...

  • (功能测试合集)弹出窗口的常用测试点

    弹窗的类型弹窗的操作集合弹窗加载和展示弹窗的元素弹窗的属性弹窗的兼容性弹窗的风险参考文献 前言手机App弹窗是目前...

  • Vue2 element-ui2.12 MessageBox自动

    需求:点击页面一个按钮,弹出一个弹窗A,点击弹窗A的按钮,弹出弹窗B。 用的是messageBox,出现的问题,一...

  • React 如何设计一个弹窗组件

    需求 弹窗出现时,固定在屏幕中间 弹窗中标题、内容文字自定义 取消按钮可选 点击关闭按钮,弹窗消失 点击确定,Re...

  • UITapGestureRecognizer与didSelect

    需求要做一个这样的下拉弹窗 点击弹窗选中Cell 点击其他区域弹窗消失 贴代码 解决冲突代码 这个是UIGest...

  • Echarts鼠标事件阻止冒泡

    不知道大家在使用echarts的鼠标事件时,有没有类似弹窗那种需求(点击弹窗外的遮罩区域,弹窗消失):此处即点击图...

  • android studio中快速定位文件的存储位置

    选中某个文件,点击nevigate=>点击select in 会出现一个弹窗,选中弹窗里面的8 Reveal in...

网友评论

      本文标题:点击展示弹窗

      本文链接:https://www.haomeiwen.com/subject/ucniqqtx.html