zoukankan      html  css  js  c++  java
  • 基于Bootstrap的遮罩层,带有加载提示

    1、body中的html

    <div class="modal fade" id="loadingModal">
        <div style=" 200px;height:20px; z-index: 20000; position: absolute; text-align: center; left: 50%; top: 50%;margin-left:-100px;margin-top:-10px">
            <div class="progress progress-striped active" style="margin-bottom: 0;">
                <div class="progress-bar" style=" 100%;"></div>
            </div>
            <h5>正在加载...</h5>
        </div>
    </div>

    2.jquery 代码

    //显示
    $("#loadingModal").modal('show');
    //隐藏
    $("#loadingModal").modal('hide');

    3、其他设置

    //使点击空白处遮罩层不会消失 
    $("#loadingModal").modal({backdrop:'static'});
    //按Tab键遮罩层不会消失 ,默认值为true 
    $("#loadingModal").modal({keyboard:false});
    
    //也可以一起运用
    //backdrop 为 static 时,点击模态对话框的外部区域不会将其关闭。
    //keyboard 为 false 时,按下 Esc 键不会关闭 Modal。
    $('#loadingModal').modal({backdrop: 'static', keyboard: false});
  • 相关阅读:
    redis:高可用分析
    mysql:explain分析sql
    python中注意事项(更新)
    jupyter使用小技巧(更新)
    Jupyter中的快捷键
    Excel制作甘特图
    Vim编辑器常用命令
    Mysql主从
    常用MySql命令
    进程与线程的一个简单解释
  • 原文地址:https://www.cnblogs.com/jswang/p/9040499.html
Copyright © 2011-2022 走看看