纯css写加载数据的等待效果

效果图：

css代码：

<div id="loadingDiv" style="width:100%;height:100%;position: absolute;z-index: 5000;display: none">
    <div style="border: 1px solid #4083c2;width:90px;padding-left:5px;line-height: 32px;height: 32px;top:50%;margin-top: -15px;left:50%;margin-left: -45px;position: fixed;background-color: #ffffff;">
        <div style="float: left;padding-top: 5px;padding-right: 5px;"><img src="static/imgs/loading.gif" style="width:22px;height: 22px;"></div>
        <div style="font-size: 10pt;float: left">计算中...</div>
    </div>
</div>

loading.gif:

调用：

$("#loadingDiv").show();
$("#loadingDiv").hide();

 

感兴趣的小伙伴可以扫码关注下公众号哦，公众号会分享高质量的技术文章哦