手机端弹出层确认框loading加载框文字图片框效果代码

代码语言:html

所属分类:弹出层

代码描述:手机端弹出层确认框loading加载框文字图片框效果代码

代码标签: 确认 loading 加载 文字 图片 效果

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">

    <meta content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0,user-scalable=no" name="viewport" />
    <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/mdialogmin.css">
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/mdialogmin.js"></script>
    <style>
        * {
            margin: 0;
            padding: 0;
        }
        .mDialogs {
            display: inline-block;
            padding: 0 20px;
            text-decoration: none;
            outline: none;
            margin: 20px 10px;
            background: #222;
            color: #fff;
            line-height: 40px;
            text-align: center
        }
        .dialog_load2.c_alert_wrap {
            background: none;
            box-shadow: none
        }

        .dialog_load.c_alert_wrap {
            background: none;
        }

        .dialog_load .c_alert_con {
            background: rgba(0,0,0,.7);
            padding: 24px 25px
        }

        .c_alert_con img {
            vertical-align: top
        }
    </style>
</head>
<body>
    <a class="mDialogs" id="mdialog1" href="javascript:;">默认</a>
    <a class="mDialogs" id="mdialog2" href="javascript:;">2秒后自动关闭</a>
    <a class="mDialogs" id="mdialog3" href="javascript:;">带有title</a>
    <a class="mDialogs" id="mdialog4" href="javascript:;">带有按钮</a>
    <a class="mDialogs" id="mdialog5" href="javascript:;">追加样式</a>
    <a class="mDialogs" id="mdialog6" href="javascript:;">其他</a>
    <a class="mDialogs" id="mdialog9" href="javascript:;">正在加载</a>
</body>
<script>
    /**使用说.........完整代码请登录后点击上方下载按钮下载查看

网友评论0