使用js重写confirm弹窗，支持回调函数，弹窗出现时页面不可滑动/滚动

最新推荐文章于 2024-04-14 16:21:13 发布

summer_my_sunshine

最新推荐文章于 2024-04-14 16:21:13 发布

阅读量2.3k

点赞数

本文链接：https://blog.csdn.net/summer_my_sunshine/article/details/102915385

版权

因项目需要，自己网上找了一些代码然后再完善了一些，增加了弹窗出现时不可滑动/滚动，可自定义弹窗的标题、内容、按钮文字等，无需jquery，引入jquery是为了测试，代码如下：

<!DOCTYPE html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <title>js confirm弹出框自定义样式</title>
    <style>
    html,
    body {
        margin: 0;
        padding: 0;
        font-family: "Microsoft YaHei";
    }
    .wrap-dialog {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        font-size: 16px;
        text-align: center;
        background-color: rgba(0, 0, 0, .4);
        z-index: 999;
    }

    .dialog {
        position: relative;
        margin: 10% auto;
        width: 300px;
        background-color: #FFFFFF;
    }

    .dialog .dialog-header {

最低0.47元/天解锁文章

summer_my_sunshine

关注

0
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
使用js重写confirm弹窗，支持回调函数，弹窗出现时页面不可滑动/滚动

因项目需要，自己网上找了一些代码然后再完善了一些，增加了弹窗出现时不可滑动/滚动，可自定义弹窗的标题、内容、按钮文字等，无需jquery，引入jquery是为了测试，代码如下：<!DOCTYPE html><head> <meta charset="utf-8"> <meta name="viewport" content="wi...
复制链接

扫一扫