kero/snippets/examples/dt/datatable/loading/widget.html

<div class="u-container-fluid u-widget-bg">
    <div class="u-row">
        <div class="u-col-md-12">
            <div class="u-widget  u-widget-right">
                <div class="u-widget-heading">
                    <h3 class="u-widget-title">圆环加载条</h3>
                </div>
                <div class="u-widget-body">
                    <!--圆环加载条代码 -->
                    <div class="u-loading"></div>未激活loading
                    <br/>
                    <div class="u-loading is-active"></div>激活loading
                    <br/>
                    <div class="u-loading is-active u-loading-single-color"></div>激活loading，使用单一颜色
                </div>
            </div>
        </div>
    </div>
    <div class="u-row">
        <div class="u-col-md-12">
            <div class="u-widget  u-widget-right">
                <div class="u-widget-heading">
                    <h3 class="u-widget-title">圆点加载条</h3>
                </div>
                <div class="u-widget-body">
                    <!--圆点加载条代码 -->
                    <button class="u-button  raised primary" id="add">添加遮罩层loader</button>
                    <button class="u-button  raised primary" id="hide" style="z-index: 1000000">取消遮罩层loader</button>
                    <div id='parentLoad'></div>
                </div>
            </div>
        </div>
    </div>
</div>